gpt4 book ai didi

javascript - 仅在选择 1/3 + 1/3 单选选项时使按钮可单击

转载 作者:搜寻专家 更新时间:2023-10-31 21:47:21 26 4
gpt4 key购买 nike

我怎样才能使下一个<button>在 html 底部只有当一个时才可点击<input type="radio">被检查?另外,如何将它应用到我当前的函数中?

按钮本身会触发一个 jquery,它将隐藏这个特定的字段集并显示另一个(请参阅 javascript 的底部)。

HTML:

<div id="q1">
<fieldset class="fiel" name="q1">
<?php
$tidlol=$_GET['team'];
echo "<input type='hidden' name='teamid' value='$tidlol'>";
?>
<img class="img2" src="img/q1.svg" alt="communication">
<img class="img3" src="img/f1.svg" alt="communication">
<div class="qb">
<div class="great">
<p class="tq"><?php echo $q1awesome ?></p>
</div>
<div class="alone">
<p class="tq"><?php echo $q1awful ?></p>
</div>
</div>
<fieldset class="mama">
<li>
<label>
<input type="radio" name="trend1" value="Progressing" onchange="GrabTrend(this)" />
<img src="upp.png">
</label>
</li>
<li>
<label>
<input type="radio" name="trend1" value="Constant" onchange="GrabTrend(this)" />
<img src="right.png">
</label>
</li>
<li>
<label>
<input type="radio" name="trend1" value="Regressing" onchange="GrabTrend(this)" />
<img src="down.png">
</label>
</li>
</fieldset>
<div id="answ">
<div id="forklarning">
<p class="fq"><b>Factors to consider</b>: <?php echo $ftc1 ?></p>
</div>
<li>
<input type="radio" id="q1r1" name="q1" value="Awesome" onchange="GrabData(this)">
<label class="button1" for="q1r1">Awesome</label>
</li>
<li>
<input type="radio" id="q1r2" name="q1" value="Ok" onchange="GrabData(this)">
<label class="button2" for="q1r2">Ok</label>
</li>
<li>
<input type="radio" id="q1r3" name="q1" value="Awful" onchange="GrabData(this)">
<label class="button3" for="q1r3">Awful</label>
</li>
<br>
<br>
<div class="comment">
<textarea name='q1comment' id='comment'></textarea>
<br>

</div>

<div id="hideQ1" style="float:right;">
<button class="next" type="button" name="hideQ1">Next</button>
</div>
</div>
</fieldset>
</div> <!--Forgot to include the first div..-->
<script>
$(document).ready(
function() {
$("#hideQ1").click(function() {
$("#q1").toggle();
$("#q2").toggle();
});
});
</script>

编辑:

它必须检查特定字段集中的两个 radio 检查,

<fieldset class="fiel" name="q1">

也就是说,因为当我单击“下一步”时,这个字段集将隐藏,而另一个带有新单选框的字段集将出现。

编辑 2:

下一个 div 是相同的,但数字 +1

<div id="q2" style="display:none;">
<fieldset class="fiel" name="q2">
<img class="img2" src="img/q2.svg" alt="communication">
<img class="img3" src="img/f2.svg" alt="communication">
<div class="qb">
<div class="great">
<p class="tq"><?php echo $q2awesome ?></p>
</div>
<div class="alone">
<p class="tq"><?php echo $q2awful ?></p>
</div>
</div>
<fieldset class="mama">

<li>
<label>
<input type="radio" name="trend2" value="Progressing" onchange="GrabTrend2(this)" />
<img src="upp.png">
</label>
</li>
<li>
<label>
<input type="radio" name="trend2" value="Constant" onchange="GrabTrend2(this)" />
<img src="right.png">
</label>
</li>
<li>
<label>
<input type="radio" name="trend2" value="Regressing" onchange="GrabTrend2(this)"/>
<img src="down.png">
</label>
</li>
</fieldset>
<div id="answ">
<div id="forklarning">
<p class="fq"><b>Factors to Consider </b>: <?php echo $ftc2 ?></p>
</div>
<li>
<input type="radio" id="q2r1" name="q2" value="Awesome" onchange="GrabData2(this)">
<label class="button1" for="q2r1">Awesome</label>
</li>
<li>
<input type="radio" id="q2r2" name="q2" value="Ok" onchange="GrabData2(this)">
<label class="button2" for="q2r2">Ok</label>
</li>
<li>
<input type="radio" id="q2r3" name="q2" value="Awful" onchange="GrabData2(this)">
<label class="button3" for="q2r3">Awful</label>
</li>
<br>
<br>
<div class="comment">
<textarea name='q2comment' id='comment'></textarea>
</div>

<div id="hideQ2" style="float:right;">
<button class="next" type="button" name="hideQ2">Next</button>
</div>
</div>
</fieldset>
</div>

和 2.. 的 jQuery

    //Show/hide questions on click Next
$(document).ready(
function() {
$("#hideQ1").click(function() {
$("#q1").toggle();
$("#q2").toggle();
});
});
$(document).ready(
function() {
$("#hideQ2").click(function() {
$("#q2").toggle();
$("#q3").toggle();
});
});

最佳答案

您可以将 change 事件附加到后代 input 元素,并确定是否至少选择了两个单选元素。然后根据这个 bool 值设置 button 元素的 disabled 属性。

Example Here

$('fieldset button').attr('disabled', true);

$('fieldset input').on('change', function() {
var disabled = $(this).closest('fieldset').find('input:checked').length < 2;
$(this).closest('fieldset').find('button').attr('disabled', disabled);
});

关于javascript - 仅在选择 1/3 + 1/3 单选选项时使按钮可单击,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34365907/

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