我希望下面代码中的文本框能够显示用户何时选择“是”并隐藏他们是否选择“否”。
<table>
<tr>
<td style="width: 130px">
<label for="edit-title" class="control-label" style="font-size: small;">Willing to Post?</label>
</td>
<td>
<input type="radio" value="0" name="yesnopricing" checked="checked"> No</td>
<td>
<input type="radio" style="padding-left: 20px;" value="1" name="yesnopricing"> Yes</td>
<td style="width: 25px"></td>
<td>
<input type="text" name="postageprice" placeholder="Postage Price">
</td>
</tr>
</table>
答案 0 :(得分:0)
尝试做一些dom遍历,然后用值切换,
$(":radio[name='yesnopricing']").change(function(){
$(this).parent().nextAll("td:has(input[name='postageprice'])").toggle(!!+this.value);
});
答案 1 :(得分:0)
将事件onclick添加到radio类型的两个输入。然后检查选择了哪一个,并依赖于输入类型文本上的调用方法hide()或show()。
答案 2 :(得分:0)
请尝试使用class
或id
来识别您的输入,然后点击event
显示隐藏您的字段,请查看以下示例。
希望这有帮助。
$('body').on('click', '.yes_pricing', function(){
$('#post_age_price').show();
})
$('body').on('click', '.no_pricing', function(){
$('#post_age_price').hide();
})
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table >
<tr>
<td style="width: 130px">
<label for="edit-title" class="control-label" style="font-size: small;">Willing to Post?</label>
</td>
<td>
<input class='no_pricing' type="radio" value="0" name="yesnopricing"> No</td>
<td><input class='yes_pricing'type="radio" style="padding-left: 20px;" value="1" name="yesnopricing" checked="checked"> Yes</td>
<td style="width: 25px"></td>
<td> <input id="post_age_price" type="text" name="postageprice" placeholder="Postage Price"></td>
</tr>
</table>
&#13;