选中框时显示按钮

Question

我正在建立一个订阅偏好中心，我想在页面上显示一个按钮，如果订阅被选中（意味着他们已经选择接收这些类型的电子邮件）。如果未选中订阅，则会显示以下内容：<input id="id_10139347" type="checkbox" name="id_10139347" >检查订阅时，它会显示：<input id="id_10139347" type="checkbox" name="id_10139347" checked>我如何在第二个要点中使用短语“已检查”，以便它在网页上显示一个按钮？

Answer 1

我准备了一个简单的解决方案，当您单击复选框时，仅使用 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

Answer 2

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

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

    if(this.checked) {

        //Do stuff

    }

});

Answer 3

您可以执行以下操作：

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()单击输入框时会触发该函数。如果选中输入，则显示按钮。否则不显示。