如果输入有值,则应该选中特定的单选按钮
If an input has a value, specific radio button should be checked
我想检查输入(name="companyname"
)是否有值,如果有,它应该检查单选按钮(id="Zakelijk"
)。如果它没有任何值,它应该检查另一个单选按钮(id="Particulier"
)。
查看我当前的代码:
<script type="text/javascript">
function ShowHideDiv() {
var chkYes = document.getElementById("Zakelijk");
var dvPassport1 = document.getElementById("checkzakelijk");
var dvPassport2 = document.getElementById("checkzakelijk1");
var dvPassport3 = document.getElementById("checkzakelijk2");
var display = chkYes.checked ? "block" : "none";
dvPassport1.style.display = display;
dvPassport2.style.display = display;
dvPassport3.style.display = display;
}
</script>
<div class="col-md-12 check-business">
<div class="form-group form-group-xl">
<label for="Particulier"><input type="radio" id="Particulier"checked="checked" name="checkzakelijk" onclick="ShowHideDiv()" />Particulier</label>
<label for="Zakelijk"><input type="radio" id="Zakelijk" name="checkzakelijk" onclick="ShowHideDiv()" />Bedrijf</label>
</div>
</div>
<div class="col-md-12" id="checkzakelijk" style="display:none;">
<div class="form-group">
<label for="inputCompanyName" class="control-label">{$LANG.clientareacompanyname}</label>
<input type="text" name="companyname" id="inputCompanyName" value="{$clientcompanyname}"{if in_array('companyname', $uneditablefields)} disabled="disabled"{/if} class="form-control" />
</div>
</div>
还有其他的方法,但这应该让你开始:
$(function() {
if (($("#inputCompanyName").val() || "") != "")
{
$("#Zakelijk").prop("checked", true)
} else {
$("#Particulier").prop("checked", true)
}
});
这是基于你的html,其中输入名称='companyname'也有id 'inputCompanyName',并将清除其他电台,因为他们有相同的name=
编辑工作jsfiddle: https://jsfiddle.net/76x42os0/4
更改代码框(左上角)中的输入值,并单击"运行"。
更新:更新到指定的jquery 3.1.0版本,并发现新版本的jquery 需要 id=匹配#,而之前它匹配的是name=
如果您想在输入更改时检查它,您可以
$("input[name='companyname']").change(function(){
var hasValue = $(this).val() === "";
$("#Zakelijk").prop("checked", hasValue);
$("#Particulier").prop("checked", !hasValue);
})
您可以优化代码,但这是更可读的
如果你需要Javascript的解决方案
if(document.getElementById("inputCompanyName").value !== ""){
document.getElementById("Zakelijk").checked = true;
document.getElementById("Particulier").checked = false;
}
else{
document.getElementById("Particulier").checked = true;
document.getElementById("Zakelijk").checked = false;
}
这是一个工作示例,说明您所追求的内容(尽管没有考虑HTML id/布局,但您可以简单地更改其中的id)。
$("#text-box").on('change', function(){
if($(this).val() != ""){
$('#rd1').prop("checked", true)
}else{
$('#rd2').prop("checked", true)
}
});
https://jsfiddle.net/bm18hmLa/3/它与已更改的事件挂钩,因此每次文本框的值被更改时都会发生。
后想:
改变 $("#text-box").on('change', function(){
$("#text-box").on('input', function(){
使它在响应性方面稍微"好一点"。
https://jsfiddle.net/bm18hmLa/5/,这里有一个版本,也有你的ID名。
https://jsfiddle.net/bm18hmLa/6/相关文章:
- 互斥单选按钮和相应的输入字段
- 选择单选按钮更新2个输入字段
- 启用特定输入上的单选按钮
- 整数 + 2x 单选按钮设置输入 --> 输出
- 使用HTML和Javascript,使用4个单选按钮显示和隐藏输入字段
- 基于输入值的单选按钮选择
- 如何基于单选按钮切换启用/禁用输入字段
- 如何在javascript或ajax中获取输入单选按钮值并显示/隐藏按钮
- 如果用户更改下拉选择,jQuery将删除单选按钮/输入选项
- 如何在选中单选按钮(输入)时触发事件
- 根据选定的单选按钮输入显示/隐藏 DIV
- 根据单选按钮输入将表单发送给不同的收件人
- 单选按钮输入控制客户端验证
- 如何使用单选按钮输入禁用表单的某些元素
- 单选按钮输入字段的JavaScript函数
- 无法使用JavaScript/jQuery动态删除单选按钮输入字段
- 使用jQuery存储单选按钮输入的数值
- Javascript:从两个文本输入和一个单选按钮输入生成URL
- 将单选按钮输入添加到文本框输入中,并将其存储在列表中
- 获取单选按钮输入的未定义值