JQuery更改事件仅在页面未完全加载时触发,并且在页面完全加载时无法触发

时间:2013-09-24 15:35:57

标签: javascript php jquery ajax

我的网页使用了大量的jquery脚本,我根据状态输入字段中的输入预填充我的位置字段,并使用一些警报来确保触发更改事件。但是我注意到事件只在网页加载时触发,而不是在页面完全加载后触发。

这是网址: http://mmarket.vas2nets.com/request.phphttp://mmarket.vas2nets.com/register.php

我猜我的剧本中存在一些冲突,任何帮助都会受到赞赏。

注意:请不要介意我的长脚本,这是通过查看它来实现的。

<head>
//load the jquery script and test the function.    
<script src='http://code.jquery.com/jquery-latest.min.js'></script>

<script type='text/javascript'>
$(document).ready(function(){


$("div.span3 #state").change(function(){

 var data = $("div.span3 #state").serialize();
alert(data);
   $.ajax({

       url  : 'populateLocation.php',
       type : 'POST',
       data : data,
       success:function(data){
                $('#location').html(data)
               }
    })


   });

});

</script>


</head>
<body>


<div id="wrapper">
<section class="container">
<div class="dynamicContent">

<div class="inner">
<div class="row">
<div class="span8 offset2">
<header>
<h2>Provider's Registration</h2>
</header>
<div>
<div>
<div class="outside">
<div class="">
<div>

<div class="row">
<div class="span3  offset1">
<dl class="dl-horizontal">
<dt>m</dt>
<dd>
<p>M-Market</p>
<p><a href="#" class="btn btn-link">more<span></span></a></p>
</dd>

</dl>
</div>
<div class="span3">

<form name="register" id="register" method="post" class="form_login" action="">
<label name="username">NAME</label>
<input type="text" name="name" id="name"/>
<label name="phone">MOBILE NUMBER</label>
<input type="text" onfocus="if(this.value =='2348XXXXXXXX' ) 
this.value=''"     onblur="if(this.value=='') 
this.value='2348XXXXXXXX'"  value="2348XXXXXXXX" name="phone"/>
<label name="password">PASSWORD</label>
<input type="password" name="password" id="password"/>
<label name="password2">RETYPE PASSWORD</label>
<input type="password" name="password2" id="password2"/>
<label>SERVICE</label>
<select name="provider" id="provider">
<option value="">Select Your Service</option>
<?php echo $service_fields; ?>
</select>
<label>STATE</label>
<select  id ="state" name="state">
<option value='0'>--- SELECT STATE------</option>
<?php echo $state_fields; ?>
</select></div>
<label>LOCATION</label>enter code here
<select id='location'> </select>

1 个答案:

答案 0 :(得分:1)

对于需要加载页面的组件,请使用$(window).load()而不是$(document).ready()

这样做非常合理:

$(window).load(function() {

  // code that requires the page to be loaded

});

$(document).ready(function() {

  // other code

});

$(window).load()等待包括图像在内的所有元素,而$(document).ready()只等待基本的DOM元素。