我有一个使用PHP动态生成的下拉列表。其呈现的HTML类似于下面的标记-
<select size="8" id="email" name="email">
<option value="6" data-userId="uid6">[email protected]</option>
<option value="8" data-userId="uid8">[email protected]</option>
<option value="3" data-userId="uid3">myexample.com</option>
<option value="7" data-userId="uid7">[email protected]</option>
<option value="2" data-userId="uid2">facebook.com</option>
<option value="4" data-userId="uid4">lankainstitute.com</option>
</select>
使用此标记,我只想检查是否使用JavaScript选择了项目。如果未选择任何项目,那么我需要获取警报消息。
我尝试过这样的事情。但是我无法使其正常工作。
JavaScript-
var email = document.getElementById("email");
var selectedValue = email.options[email.selectedIndex].value;
if (selectedValue == '') {
alert("Please select a email");
}
希望有人可以帮助我。谢谢你。
您应该侦听change
select元素的事件,然后将所选选项的值解析为整数(parseInt(email.options[email.selectedIndex].value, 10)
):
var email = document.getElementById("email");
email.addEventListener('change', function (e) {
var selectedValue = parseInt(email.options[email.selectedIndex].value, 10);
if (selectedValue === 7) {
alert("Please select a email");
}
});
var email = document.getElementById("email");
email.addEventListener('change', function (e) {
var selectedValue = parseInt(email.options[email.selectedIndex].value, 10);
if (selectedValue === 7) {
alert("Please select a email");
}
});
<select size="8" id="email" name="email">
<option value="6" data-userId="uid6">[email protected]</option>
<option value="8" data-userId="uid8">[email protected]</option>
<option value="3" data-userId="uid3">myexample.com</option>
<option value="7" data-userId="uid7">[email protected]</option>
<option value="2" data-userId="uid2">facebook.com</option>
<option value="4" data-userId="uid4">lankainstitute.com</option>
</select>
...由于您正在验证是否选择了一个选项,因此您将在以下方面使用更多内容:
var email = document.getElementById("email"),
validationButton = document.getElementById('validationButton');
validationButton.addEventListener('click', function (e) {
var selectedValue = email.options[email.selectedIndex] ? email.options[email.selectedIndex].value : null;
if (!selectedValue) {
alert("Please select a email");
}
});
var email = document.getElementById("email"),
validationButton = document.getElementById('validationButton');
validationButton.addEventListener('click', function (e) {
var selectedValue = email.options[email.selectedIndex] ? email.options[email.selectedIndex].value : null;
if (!selectedValue) {
alert("Please select a email");
}
});
<select size="8" id="email" name="email">
<option value="6" data-userId="uid6">[email protected]</option>
<option value="8" data-userId="uid8">[email protected]</option>
<option value="3" data-userId="uid3">myexample.com</option>
<option value="7" data-userId="uid7">[email protected]</option>
<option value="2" data-userId="uid2">facebook.com</option>
<option value="4" data-userId="uid4">lankainstitute.com</option>
</select>
<button id="validationButton">Check if selected</button>
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句