gpt4 book ai didi

javascript - 页面重新加载时隐藏功能会忽略选中的输入,仅在单击时起作用

转载 作者:行者123 更新时间:2023-12-02 23:55:18 25 4
gpt4 key购买 nike

我正在使用 JQuery 根据是否加载复选框来隐藏附加输入。他们有六个,所以我使用了一个适用于所有人的函数(即使他们的 ID 是唯一的。)第一次选择它们时效果很好,但是当我选择显示的选项之一(单击后)时,页面会重新加载附加数据。在此重新加载期间,php 检查“选中”框并添加 html 来声明它已选中。但是 .js 看不到这一点,并且仍然隐藏子数据,除非我取消选中该框并重新选中它。

我尝试加载文档来查找它,并将函数的检查部分移到检查事件之外。

<script>
$(function() {

$('.hidden').hide();

$('.trigger').change(function() {
var hiddenId = $(this).attr("data-trigger");

if ($(this).is(':checked')) {
$("#" + hiddenId).show();
} else {
$("#" + hiddenId).hide();
}

});
});
</script>
<html>
<div class="boxed show1">
<h3>Strategy Choices</h3>
<input type="checkbox" name="repeatFromLastGame" value="1" checked="checked" data-trigger="hidden_fields_one" class="trigger"> Repeat Numbers from last Game?<br>
<div id="hidden_fields_one" class="hidden" style="display: none;">
<label for="numberRepeats">Number of Repeats from last game to use?</label><br>
<select name="numberRepeats">
<option value="0">0</option>
<option value="1" selected="">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>
</div><br>
<label for="chit1">Repeat 1</label><br>
<select name="chit1">
<option value="8">8</option>
<option value="38" selected="selected">38</option>
<option value="43">43</option>
<option value="52">52</option>
<option value="55">55</option>
</select>
</div>
</html>

我想要查看是否先选中该复选框,如果没有选中则将其隐藏。

最佳答案

$(function() {
// listen for trigger changes
$('.trigger').change(function() {
updateView();
});

// on page load checks the trigger value and updates the view
updateView();

});

function updateView(){
var hiddenId = $('.trigger').attr("data-trigger");

if ($('.trigger').is(':checked')) {
$("#" + hiddenId).show();
} else {
$("#" + hiddenId).hide();
}
}
.hidden{
display: none;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<html>
<div class="boxed show1">
<h3>Strategy Choices</h3>
<input type="checkbox" name="repeatFromLastGame" value="1" checked="checked" data-trigger="hidden_fields_one" class="trigger"> Repeat Numbers from last Game?<br>
<div id="hidden_fields_one" class="hidden" style="display: none;">
<label for="numberRepeats">Number of Repeats from last game to use?</label><br>
<select name="numberRepeats">
<option value="0">0</option>
<option value="1" selected="">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>
</div><br>
<label for="chit1">Repeat 1</label><br>
<select name="chit1">
<option value="8">8</option>
<option value="38" selected="selected">38</option>
<option value="43">43</option>
<option value="52">52</option>
<option value="55">55</option>
</select>
</div>
</html>

关于javascript - 页面重新加载时隐藏功能会忽略选中的输入,仅在单击时起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55424654/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com