Я пытался лучше понять jQuery и придумывал случайные страницы, чтобы протестировать некоторые из них. Я сделал небольшую макетную страницу туристического агентства, на которой есть форма с вариантами стран отправления и назначения. Пунктом отправления/назначения по умолчанию являются США, а под ним появляется второй вариант для Штатов. Когда пользователь выбирает что-то другое, кроме США, параметр состояний исчезает, за исключением Chrome.
веб-сайт: http://www.stephenweigel.com/portfolio/somewheresomehow
Сценарий: (имеет $(document).ready(function() , не думал, что мне нужно публиковать весь JS-файл)
$('#destination').click(function(){
// Show US States if Destination is US
var destination = $('#destination').val();
var domestic = 'USA';
if (destination == domestic) {
$('#usDest').css("display","inline");
} else {
$('#usDest').css("display","none");
}
HTML:
<div>
<select name="destination" id="destination">
<option value="USA" selected="selected">USA</option>
<option value="Canada">Canada</option>
<option value="Mexico">Mexico</option>
<option value="Italy">Italy</option>
<option value="France"> France </option>
<option value="Spain"> Spain </option>
</select> <!--end destination-->
</div>
<div>
<select name="usDest" id="usDest">
<option value="Alabama" selected="selected">Alabama</option>
<option value="Alaska">Alaska</option>
<option value="Arizona">Arizona</option>
<option value="Arkansas">Arkansas</option>
<option value="California">California</option>
<option value="Colorado">Colorado</option>
<option value="Connecticut">Connecticut</option>
<option value="Delaware">Delaware</option>
<option value="District of Columbia">District of Columbia</option>
<option value="Florida">Florida</option>
<option value="Georgia">Georgia</option>
<option value="Hawaii">Hawaii</option>
<option value="Idaho">Idaho</option>
<option value="Illinois">Illinois</option>
<option value="Indiana">Indiana</option>
<option value="Iowa">Iowa</option>
<option value="Kansas">Kansas</option>
<option value="Kentucky">Kentucky</option>
<option value="Louisiana">Louisiana</option>
<option value="Maine">Maine</option>
<option value="Maryland">Maryland</option>
<option value="Massachusetts">Massachusetts</option>
<option value="Michigan">Michigan</option>
<option value="Minnesota">Minnesota</option>
<option value="Missouri">Missouri</option>
<option value="Montana">Montana</option>
<option value="Nebraska">Nebraska</option>
<option value="Nevada">Nevada</option>
<option value="New Hampshire">New Hampshire</option>
<option value="New Jersey">New Jersey</option>
<option value="New Mexico">New Mexico</option>
<option value="New York">New York</option>
<option value="North Carolina">North Carolina</option>
<option value="North Dakota">North Dakota</option>
<option value="Ohio">Ohio</option>
<option value="Oklahoma">Oklahoma</option>
<option value="Oregon">Oregon</option>
<option value="Pennsylvania">Pennsylvania</option>
<option value="Rhode Island">Rhode Island</option>
<option value="South Carolina">South Carolina</option>
<option value="South Dakota">South Dakota</option>
<option value="Tennessee">Tennessee</option>
<option value="Texas">Texas</option>
<option value="Utah">Utah</option>
<option value="Vermont">Vermont</option>
<option value="Virginia">Virginia</option>
<option value="Washington">Washington</option>
<option value="West Virginia">West Virginia</option>
<option value="Wisconsin">Wisconsin</option>
<option value="Wyoming">Wyoming</option>
</select> <!-- end usDest-->
</div>
Может быть, я что-то упускаю, но кажется странным, что это будет работать для Firefox, Safari и Internet Explorer 9, но не будет работать в Chrome.
Я также пытался использовать:
$('#origin').click(function(){
var origin = $('#origin').val();
var domestic = 'USA';
if (origin == domestic) {
$('#usOrigin').removeClass("invisible");
$('#usOrigin').addClass("visible");
} else {
$('#usOrigin').removeClass("visible");
$('#usOrigin').addClass("invisible");
}
с CSS:
.visible {
display: inline;
}
.invisible {
display: none;
}
но это не работает ни в хроме. (работает в других браузерах)
Мы ценим любые предложения.