我有3个标记字段,我只想要一个基本逻辑,如果这些字段留空,则不会显示此<div id="category">
。
[编辑]更新了
<div id="panel">
<div id="form">
<div class="input-prepend">
<span class="add-on">name</span>
<input class="span3 required" id="prependedInput" type="text">
</div>
<div class="input-prepend">
<span class="add-on">last name</span>
<input class="span3 required" id="prependedInput" type="text" placeholder="Your Lastname">
</div>
<div class="input-prepend">
<span class="add-on">email</span>
<input class="span3 required" id="prependedInput" type="text" placeholder="Your Email">
</div>
</div> <!--/form-->
</div> <!--/panel-->
<!--DROPDOWN-->
<select id="category">
<option value="" disabled="disabled" selected="selected">Please select a category</option>
<option name="choice1" value="blue"> blue </option>
<option name="choice2" value="red"> red </option>
<option name="choice3" value="pink"> pink </option>
<option name="choice4" value="yellow"> yellow </option>
<option name="choice5" value="violet"> violet </option>
</select>
这是我的jquery,它似乎对我有用。
if ($j(".required").is(':empty')) {
$j("#category").hide();
} else {
$j('#category').show();
}
答案 0 :(得分:1)
<强> [增订] 强>
HTML:
<div id="panel">
<div id="form">
<div class="input-prepend"> <span class="add-on">name</span>
<input class="span3 required" id="prependedInput" type="text">
</div>
<div class="input-prepend"> <span class="add-on">last name</span>
<input class="span3 required" id="prependedInput" type="text" placeholder="Your Lastname">
</div>
<div class="input-prepend"> <span class="add-on">email</span>
<input class="span3 required" id="prependedInput" type="text" placeholder="Your Email">
</div>
</div>
<!--/form-->
</div>
<!--/panel-->
<!--DROPDOWN-->
<select id="category" style="display:none;">
<option value="" disabled="disabled" selected="selected">Please select a category</option>
<option name="choice1" value="blue">blue</option>
<option name="choice2" value="red">red</option>
<option name="choice3" value="pink">pink</option>
<option name="choice4" value="yellow">yellow</option>
<option name="choice5" value="violet">violet</option>
</select>
JS:
$j(function () {
$j(".required").on("keypress keyup change", function () {
var show_flag = true;
$('.required').each(function (i) {
if ($(this).val() == "") {
show_flag = false;
}
});
if (show_flag) {
$("#category").show();
} else {
$("#category").hide();
}
});
});
jsfiddle:http://jsfiddle.net/nyzm/E8X5S/3/
答案 1 :(得分:0)
试
if ($(".required").html().length > 0) {
$('#category').show();
}
else {
$("#category").hide();
}
答案 2 :(得分:0)
使用
if($j(".required").val('')){
$('#category').show();
} else {
$('#category').hide();
}
答案 3 :(得分:0)
不要使用:empty
,请尝试;
if ( !$(".required").val() ) {
$('#category').hide();
}
else {
$("#category").show();
}
不需要长度检查,因为无论如何空字符串都返回false。
答案 4 :(得分:0)
if(document.getElementById("prependedInput").value.toString().Length() > 0) {
document.getElementById("category").style.display = "block";
}
else
{
document.getElementById("category").style.display = "none";
}
答案 5 :(得分:0)
试试此代码
$j(".required").keyup(function () {
if ( $j.trim($j("this").val()) != "" ) {
$j('#category').show();
} else {
$j("#category").hide();
}
});
答案 6 :(得分:0)
我可能很感兴趣,你可能会感兴趣。
http://jsfiddle.net/ardeezstyle/Jhvt3/
$('.required').each(function(index, element) {
$(this).val()=="" ? $('#category').hide() : $('#category').show();
});