1

我有2个选择。如果用户在没有下拉选择的情况下提交表单，则会在 DIV 上显示一条消息。当用户选择值时，有一种方法可以隐藏 div（消失？）？

脚本： 

$(document).ready(function () {
$("#go").click(function () {

if (document.getElementById('sel').selectedIndex == 0)
$("#msg").html("Please select 1");


if (document.getElementById('sel2').selectedIndex == 0)
$("#msg2").html("Please select 2");

});
});

形式：

<form id="form1">  
<div id="msg"></div>                  
<select id="sel">
<option value="">-- select --</option>
<option value="valor1">Valor 1</option>
<option value="valor2">Valor 2</option>
</select>

<div id="msg2"></div>
<select id="sel2">
<option value="">-- select --</option>
<option value="valor1">Valor 1</option>
<option value="valor2">Valor 2</option>
</select>

<input type="button" id="go" value="Go" />
</form>
4

3 回答 3

2

你可以利用 jQuery 中的change事件来做什么。这使您可以监视特定元素（例如 select 元素）的更改。我为你做了一个小提琴。示例代码可以在这里看到：

$("#go").click(function () {
    if (document.getElementById('sel').selectedIndex == 0) $("#msg").html("Please select 1");
    if (document.getElementById('sel2').selectedIndex == 0) $("#msg2").html("Please select 2");
});

$('select').change(function() {
    if (document.getElementById('sel').selectedIndex != 0) $("#msg").fadeOut();
    if (document.getElementById('sel2').selectedIndex != 0) $("#msg2").fadeOut();
});

这对你来说应该是一个很好的起点。希望这可以帮助！

于 2013-03-21T03:01:10.807 回答
1

隐藏 div 的最佳方法是使用 CSS 属性 display 并将其设置为 none。在 jQuery 中，您可以使用 hide 方法或通过 css 方法手动执行此操作。

$('#msg').hide();
$('#msg2').css('display','none');
于 2013-03-21T02:56:34.433 回答
1 
$("#go").click(function () {

if ($('#sel').val() == '')
    $("#msg").text("Please select 1");


if ($('#sel2').val() == '')
$("#msg2").text("Please select 2");

});
$('#sel').change(function(){$('#msg').hide()})
$('#sel2').change(function(){$('#msg2').hide()})

和工作jsfiddle：http: //jsfiddle.net/RmYbH/2/

于 2013-03-21T03:06:11.450 回答