gpt4 book ai didi

jQuery 属性等于选择器不起作用

转载 作者:行者123 更新时间:2023-12-01 00:49:43 25 4
gpt4 key购买 nike

我在使用 jQuery 属性等于选择器时遇到一些问题。

HTML部分:

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
</head>

<body>
<form name="form1" id="form1" method="post">
<table>
<tr>
<td>Country Living In</td>
<td>
<select class="FormInput" name="Country" id="Country">
<option label="India" value="1" selected="selected">India</option>
<option label="USA" value="2">USA</option>
<option label="United Kingdom" value="3">United Kingdom</option>
<option label="Australia" value="6">Australia</option>
<option label="Malaysia" value="125">Malaysia</option>
</select>
</td>
</tr>

<tr id="stateRow">
<td>State</td>
<td>
<select class="FormInput" id="SelectState" disabled="disabled" style="display:none">
<option value="" selected="selected">- Select State -</option>
</select>
<select class="FormInput" name="State" id="State">
<option selected="selected" value="">- Select State -</option>
<option value="1">Andaman and Nicobar</option>
<option value="2">Andhra Pradesh</option>
<option value="3">Arunachal Pradesh</option>
<option value="4">Assam</option>
</select>
</td>
</tr>
<tr id="cityRow">
<td>City</td>
<td>
<select class="FormInput" id="SelectCity" disabled="disabled">
<option value="" selected="selected">- Select City -</option>
</select>

<div id="INDIA-cities">
<select class="FormInput" id="INDIA-1" name="" style="display:none">
<option value="" selected="selected">- Select City -</option>
<option value="1">Car Nicobar</option>
<option value="2">Port Blair</option>
<option value="3">Rest of Andaman and Nicobar</option>
</select>

<select class="FormInput" id="INDIA-2" name="" style="display:none">
<option value="" selected="selected">- Select City -</option>
<option value="4">Adilabad</option>
<option value="5">Anantapur</option>
<option value="6">Chittoor</option>
</select>
<select class="FormInput" id="INDIA-3" name="" style="display:none">
<option value="" selected="selected">- Select City -</option>
<option value="29">Along</option>
<option value="30">Anini</option>
<option value="31">Bomdila</option>
</select>

<select class="FormInput" id="INDIA-4" name="" style="display:none">
<option value="" selected="selected">- Select City -</option>
<option value="46">Baksa</option>
<option value="47">Barpeta</option>
<option value="48">Bongaigaon</option>
<option value="49">Chirang</option>
<option value="50">Dhemaji</option>
</select>
</div>

<select class="FormInput" id="USA-City" name="" style="display:none">
<option value="" selected="selected">- Select City -</option>
<option value="664">Abilene</option>
<option value="665">Akron</option>
<option value="666">Albany</option>
<option value="667">Albuquerque</option>
<option value="668">Alexandria</option>
<option value="867">Others</option>
</select>

<select class="FormInput" id="UK-City" name="" style="display:none">
<option value="" selected="selected">- Select City -</option>
<option value="868">Cambridge</option>
<option value="869">London</option>
<option value="870">Liverpool</option>
<option value="871">Manchester</option>
<option value="876">Others</option>
</select>

<select class="FormInput" id="AUSTRALIA-City" name="" style="display:none">
<option value="" selected="selected">- Select City -</option>
<option value="877">Sydney</option>
<option value="878">Melbourne</option>
<option value="879">Brisbane</option>
<option value="880">Perth</option>
<option value="881">Others</option>
</select>

<select class="FormInput" id="MALAYSIA-City" name="" style="display:none">
<option value="" selected="selected">- Select City -</option>
<option value="882">Subang Jaya</option>
<option value="883">Kuala Lumpur</option>
<option value="884">Klang</option>
<option value="885">Johor Bahru</option>
<option value="886">Ampang Jaya</option>
<option value="887">Others</option>
</select>
</td>
</tr>
<tr>
<td colspan="2"><input type="submit" value="submit"></td>
</tr>
</table>
</form>
</body>
</html>

和脚本部分:

$(document).ready(function(){

var stateRow = $("#stateRow"),
cityRow = $("#cityRow"),
SelectState = $("#SelectState"),
SelectCity = $("#SelectCity"),
State = $("#State"),
Country = $("#Country"),
USAcity = $("#USA-City"),
UKcity = $("#UK-City"),
AUSTRALIAcity = $("#AUSTRALIA-City"),
MALAYSIAcity = $("#MALAYSIA-City");

Country.change(function() {
var sCountry = $(this).val();
stateRow.hide();
SelectState.hide();
SelectCity.hide();
cityRow.hide();
$('#INDIA-cities').hide();
State.hide().attr({
name: '',
disabled: true
});
$('#INDIA-cities select').each(function(){
//this.id = this.id + "_" + i;
$(this).attr({
name: '',
disabled: true
});
USAcity.hide().attr({
name: '',
disabled: true
});
UKcity.hide().attr({
name: '',
disabled: true
});
AUSTRALIAcity.hide().attr({
name: '',
disabled: true
});
MALAYSIAcity.hide().attr({
name: '',
disabled: true
});
});

if(sCountry=="1") {
stateRow.show();
State.show().attr({
name: 'State',
disabled: false
});
cityRow.show();
SelectCity.show();
}
else if(sCountry=="2") {
cityRow.show();
USAcity.show().attr({
name: 'City',
disabled: false
});
}
else if(sCountry=="3") {
cityRow.show();
UKcity.show().attr({
name: 'City',
disabled: false
});
}
else if(sCountry=="6") {
cityRow.show();
AUSTRALIAcity.show().attr({
name: 'City',
disabled: false
});
}
else if(sCountry=="125") {
cityRow.show();
MALAYSIAcity.show().attr({
name: 'City',
disabled: false
});
}
});

State.change(function() {
sState = $(this).val();
$('#INDIA-cities').hide();
var len = this.length;
if(sState != '')
{
SelectCity.hide();
$('#INDIA-cities').show();
for(i=1;i<=len;i++){
var citylist = $("#INDIA-"+i);
if (sState != $(this[i]).val()) {
citylist.hide().attr('name','');
}
else
{
citylist.show().attr({
name: 'City',
disabled: false
});
}
}
}
else
{
SelectCity.show();
for(i=1;i<=len;i++){
var citylist = $("#INDIA-"+i);
citylist.hide().attr('name','');
}
}
});

State.blur(function(){
if($(this).val()=='')
{
alert("Select State");
return false;
}
else
{
return true;
}

});

$("#cityRow").find('select[name="City"]').blur(function(){
if($(this).val()=='')
{
alert("Select City");
return false;
}
else
{
return true;
}

});
});

当“城市”下拉列表启用且为空时,应弹出一个警告框,提示“选择城市”,“城市”下拉列表模糊。但它没有出现。

以上代码可在 jsfiddle 实时获取.

请帮我解决这个问题..

提前致谢。

最佳答案

这是因为在代码运行时,没有任何选择将 name 属性设置为 City。将其更改为使用像这样的实时绑定(bind),它应该可以工作:

$("#cityRow").find('select[name="City"]').live('blur', function(){

关于jQuery 属性等于选择器不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6070498/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com