jquery代码不起作用 [英] jquery code is not working
本文介绍了jquery代码不起作用的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
好日子所有，
我在我的html页面上使用jquery脚本时遇到了问题。
该脚本在 jsfiddle 上正常工作
我在我的页面上使用过：
< script src =http： //code.jquery.com/jquery-2.1.0.min.jstype =text / javascript>
< / script> < script src =bookform.jstype =text / javascript>< / script>
取货地点：< br>< input placeholder =dd-mm-yyyytype =datename =daterequired =required>
会议名称：< br>< input type =textname =namerequired>< br>
您的电话号码：< br>< input type =textname =phonerequired>< br>
取件时间：< br> < input class =largetype =textname =timerequired =required>< br>
取货地点：< br>
< select name =select1id =select1>
< option>何处取货< / option>
< option value =pick_airport>机场< / option>
< option value =pick_railway> Railway station< / option>
< option value =pick_address>地址< / option>
< / select>
< div id =pick_nextStep>< / div>
退货地点：< br>
< select name =select2id =select2>
< option>去哪里< / option>
< option value =drop_airport>机场< / option>
< option value =drop_railway> Railway station< / option>
< option value =drop_address>地址< / option>
< / select>
< div id =drop_nextStep>< / div>
但是在页面加载时，它不起作用。
bookform.js 的代码，如下所示：
$（document）.ready（function（）{
$（'＃select1'）。change（function（）{
if （$（this）.val（）=='pick_airport'）{
$（'＃pick_nextStep'）。html（'< select name =pickup locationrequired =requiredid =select1> ;< option>选择机场< / option><选项值=Sheremetievo（SVO）> Sheremetievo（SVO）< / option><选项值=多莫杰多沃（DME） < / option>< option value =Vnukovo（VKO）> Vnukovo（VKO）< / option>< / select>< br> Flight：< br>< input type = （$（this）.val（）=='pick_railway'）{$ b $ name =flightrequired size =20maxlength =255>'）;
}
b $（'＃pick_nextStep'）。html（'< select name =pickup位置required =req u>id =select1>< option value =Belorusskiy> Belorusskiy< / option>< option value =Kazanskiy> Kazanskiy< / option>< option value =Kurskiy> Kurskiy< ; / option>< option value =Kievskiy> Kievskiy< / option>< option value =Leningradskiy> Leningradskiy< / option>< option value =Paveleckiy> Paveleckiy< / option><< ; option value =Rizskiy> Rizskiy< / option>< option value =Saveloskiy> Savelovskiy< / option>< option value =Yaroslavskiy> Yaroslavskiy< / option>< / select><< ; br> Wagon：< br>< input type =textname =flightrequired size =20maxlength =255>'）; （$（this）.val（）=='pick_address'）{
$（'＃pick_nextStep'）。html（'Pickup address：< br>< input name =pickup _locationtype =textsize =20maxlength =255>'）;
}
}）;
$（'＃select2'）。change（function（）{
if（$（this）.val（）=='drop_airport'）{
$（'＃drop_nextStep'）选择机场< / option>< option value =Sheremetievo（SVO）> Sheremetievo（SVO） ）< / option><选项值=多莫杰多沃（DME）>多莫杰多沃（DME）< / option><选项值=伏努科沃（VKO） < $（this）.val（）=='drop_railway'）{
$（'＃drop_nextStep'）。< / select>< br>'）;
}
html（'< select name =pickup location_locationrequired =requiredid =select2>< option value =Belorusskiy> Belorusskiy< / option>< option value =Kazanskiy> Kazanskiy< / option>< option value =Kurskiy> Kurskiy< / option>< option value =Kievskiy> Kievskiy< / option>< option value =Leningradskiy> Leningradskiy< / option><选项值=Paveleckiy> Paveleckiy< / o < /选项><选项值=Rizskiy> Rizskiy< / option><选项值=Saveloskiy> Savelovskiy< / option>< option value =Yaroslavskiy> Yaroslavskiy< / option><选择>'）
}
if（$（this）.val（）=='drop_address'）{
$（'＃drop_nextStep'）。html（'Your destination address：< ; br>< input type =textname =dropoff_locationrequired>'）;
}
}）;
}）;
Good day All,
I've faced a problem using a jquery script on my html page.
The script works fine on jsfiddle
On my page I used:
<script src="http://code.jquery.com/jquery-2.1.0.min.js" type="text/javascript">
</script> <script src="bookform.js" type="text/javascript"></script>
Pickup location:<br><input placeholder="dd-mm-yyyy" type="date" name="date" required="required">
Name on meeting plate:<br><input type="text" name="name" required><br>
Your phone number:<br><input type="text" name="phone" required><br>
Time of pickup:<br> <input class="large" type="text" name="time" required="required"><br>
Pickup location:<br>
<select name="select1" id="select1">
<option>Where to pickup</option>
<option value="pick_airport">Airport</option>
<option value="pick_railway">Railway station</option>
<option value="pick_address">Address</option>
</select>
<div id ="pick_nextStep"></div>
Dropoff location:<br>
<select name="select2" id="select2">
<option>Where to dropoff</option>
<option value="drop_airport">Airport</option>
<option value="drop_railway">Railway station</option>
<option value="drop_address">Address</option>
</select>
<div id ="drop_nextStep"></div>
But on page load it does notwork.
解决方案
You must wrap the code of bookform.js inside DOM ready handler, just like:
$(document).ready(function() {
$('#select1').change(function(){
if($(this).val() == 'pick_airport'){
$('#pick_nextStep').html('<select name="pickup_location" required="required" id="select1"><option>Select airport</option><option value="Sheremetievo (SVO)">Sheremetievo (SVO)</option><option value="Domodedovo (DME)">Domodedovo (DME)</option><option value="Vnukovo (VKO)">Vnukovo (VKO)</option></select><br>Flight: <br><input type="text" name="flight" required size="20" maxlength="255">');
}
if($(this).val() == 'pick_railway'){
$('#pick_nextStep').html('<select name="pickup_location" required="required" id="select1"><option value="Belorusskiy">Belorusskiy</option><option value="Kazanskiy">Kazanskiy</option><option value="Kurskiy">Kurskiy</option><option value="Kievskiy">Kievskiy</option><option value="Leningradskiy">Leningradskiy</option><option value="Paveleckiy">Paveleckiy</option><option value="Rizskiy">Rizskiy</option><option value="Saveloskiy">Savelovskiy</option><option value="Yaroslavskiy">Yaroslavskiy</option></select><br>Wagon:<br><input type="text" name="flight" required size="20" maxlength="255">');
}
if($(this).val() == 'pick_address'){
$('#pick_nextStep').html('Pickup address:<br><input name="pickup_location" type="text" size="20" maxlength="255">');
}
});
$('#select2').change(function(){
if($(this).val() == 'drop_airport'){
$('#drop_nextStep').html('<select name="pickup_location" required="required" id="select1"><option>Select airport</option><option value="Sheremetievo (SVO)">Sheremetievo (SVO)</option><option value="Domodedovo (DME)">Domodedovo (DME)</option><option value="Vnukovo (VKO)">Vnukovo (VKO)</option></select><br>');
}
if($(this).val() == 'drop_railway'){
$('#drop_nextStep').html('<select name="pickup_location" required="required" id="select2"><option value="Belorusskiy">Belorusskiy</option><option value="Kazanskiy">Kazanskiy</option><option value="Kurskiy">Kurskiy</option><option value="Kievskiy">Kievskiy</option><option value="Leningradskiy">Leningradskiy</option><option value="Paveleckiy">Paveleckiy</option><option value="Rizskiy">Rizskiy</option><option value="Saveloskiy">Savelovskiy</option><option value="Yaroslavskiy">Yaroslavskiy</option></select>')
}
if($(this).val() == 'drop_address'){
$('#drop_nextStep').html('Your destination address:<br><input type="text" name="dropoff_location" required>');
}
});
});
这篇关于jquery代码不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
