为了账号安全,请及时绑定邮箱和手机立即绑定

选中框时显示按钮

选中框时显示按钮

ibeautiful 2023-01-06 11:04:08

我正在建立一个订阅偏好中心,我想在页面上显示一个按钮,如果订阅被选中(意味着他们已经选择接收这些类型的电子邮件)。

  • 如果未选中订阅,则会显示以下内容:

<input id="id_10139347" type="checkbox" name="id_10139347" >

  • 检查订阅时,它会显示:

<input id="id_10139347" type="checkbox" name="id_10139347" checked>

我如何在第二个要点中使用短语“已检查”,以便它在网页上显示一个按钮?


查看完整描述

3 回答

?
慕娘9325324

TA贡献1527条经验 获得超4个赞

我准备了一个简单的解决方案,当您单击复选框时,仅使用 CSS 来显示按钮。我希望这可以帮助你


  <label for="id_10139347"> CHECK BOX </label>

   <input class="suscriptionCheck" id="id_10139347" type="checkbox" name="id_10139347">

   <br/>

 <button>SOME BUTTON</button>


button {

  display: none;

}

.suscriptionCheck:checked ~ button{

  display:block;

  padding: 14px;

  

}

https://codepen.io/r0binxp/pen/poygbXr


查看完整回答
反对 回复 2023-01-06
?
泛舟湖上清波郎朗

TA贡献1563条经验 获得超3个赞

也许这会对你有所帮助。也有很多相同的问题得到了回答。


$("#id_10139347").change(function() {

    if(this.checked) {

        //Do stuff

    }

});


查看完整回答
反对 回复 2023-01-06
?
慕妹3242003

TA贡献1546条经验 获得超6个赞

您可以执行以下操作:


function displayButton(item) {

  if (item.checked == true) {

    document.getElementById("button").style.display = "block";

  } else {

    document.getElementById("button").style.display = "none";

  }

}

#button {

  display: none;

}

<input id="id_10139347" type="checkbox" name="id_10139347" onclick="displayButton(this)">


<button id="button">Submit</button>

displayButton()单击输入框时会触发该函数。如果选中输入,则显示按钮。否则不显示。



查看完整回答
反对 回复 2023-01-06
  • 3 回答
  • 0 关注
  • 13 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信