我有一个下拉菜单和输入框的以下代码:
<select id="ci_binfo_affiliation_type" style="" onblur="updateptcname()" onchange="changecolor()" name="ci_binfo_affiliation_type" class="styled">
<option <? if ($ci_binfo_affiliation_type == "") echo 'selected'; ?> value="">Select</option>
<option <? if ($ci_binfo_affiliation_type == "work") echo 'selected'; ?> value="work">work</option>
<option <? if ($ci_binfo_affiliation_type == "Other") echo 'selected'; ?> value="Other">Other</option>
</select>
<label class="formlbl" for="name_aftd">Name of (affiliation)</label>
<div class="formbitem">
<input id="ci_binfo_affiliation_name" type="text" onchange="updateptcname()" name="ci_binfo_affiliation_name" value="<?=$ci_binfo_affiliation_name?>" class="inputtext2" />
</div>
我想要发生的是:如果用户在下拉菜单中选择“学校”,那么在“(联属)名称”标签中必须更改为“学校名称”。
任何人都可以帮助我,我该怎么做......
答案 0 :(得分:2)
请参阅此example on jsfiddle。它将函数绑定到select
元素的change事件。此函数会在span
(id:label
)中获取新的affiliation-placeholder
元素,并将其文本内容设置为所选option
的值。
您可能想要清理其他事件侦听器(例如changecolor
,在我的示例中抛出is not defined
。首选方法是从JavaScript代码绑定侦听器,而不是在HTML中内联。
document.getElementById("ci_binfo_affiliation_type")
.addEventListener("change",function(){
document.getElementById("affiliation-placeholder").textContent = this.value;
})
使用jQuery 1.7(也添加了我添加的新span
,但如果需要可以轻松修改):
$("#ci_binfo_affiliation_type").on("change", function(){
$("#affiliation-placeholder").text($(this).val());
});
答案 1 :(得分:1)
这是你要找的吗?
$("#ci_binfo_affiliation_type").change(function() {
$("label[for='name_aftd']").text("Name of " + $(this).val());
});