2012-03-31 8 views
0

jQueryでこの奇妙な問題が発生しました。私は、HTMLの選択を変更し、別の選択要素の新しい置換HTMLデータを返す.phpへの投稿をトリガーしようとしています。 私はselect htmlをpost部分だけに置き換えることに成功しましたが、.change部分を追加すると作業が停止します。jQueryが.changeで間違っているもの

私だけ置けばここに私のテストページのHTML(それは.phpのページです)

<?php 
echo '<option value="alphabetic">alphabetic</option> 
<option selected="selected" value="grammatic">grammatic</option> 
<option value="assessment">assessment</option> 
<option value="maximatch">maximatch</option>'; 
?> 

verwerker.php

<html> 
    <head> 
     <meta content="text/html; charset=ISO-8859-1" http-equiv="content-type"> 
     <title></title> 
     </head> 
    <body> 
     <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script> 
     <script type="text/javascript" src="ajax.js"></script> 

     <select id=control6> 
      <option selected="selected" value="normal">normal</option> 
      <option value="change">change</option> 
     </select> 

     <select id=sortedselect6> 
      <option selected="selected" value="alphabetic">alphabetic</option> 
      <option value="grammatic">grammatic</option> 
      <option value="assessment">assessment</option> 
      <option value="maximatch">maximatch</option> 
     </select> 

     <select id=dummyselect6> 
      <option selected="selected" value="dummy1">dummy1</option> 
      <option value="dummy2">dummy2</option> 
     </select> 

    </body> 
</html>​ 

ajax.js

jQuery("select#control6").change(function() { 
    jQuery.post('verwerker.php', { 
     currentselect: jQuery("select#control6").val() 
    }, function(htmldata) { 
     jQuery("select#sortedselect6").html(htmldata); 
    }); 
});​ 

ですajax.jsに続いて、sortedselect6を瞬時に選択された文法に変更します。だから、.change部分が壊れている何かでなければなりませんか?

jQuery.post('verwerker.php', { 
    currentselect: jQuery("select#control6").val() 
}, function(htmldata) { 
    jQuery("select#sortedselect6").html(htmldata); 
});​ 

現在の職場でのコードの最後のピース(.changeないもの)を表示することができますhttp://www.tarile.net63.net/thebirdistheword.php

PS:{currentselect:jQueryの( "#のcontrol6を選択")のval()}後であり、今は目的がありません。

解決済み!問題は、ページがまだ完全にロードされていないため、jQueryが要素の一部をロードできなかったことです。私は本当に間違っていると思っています。あなたの基本的な変更とAjaxのコードは、このjsfiddleで正常に動作します

jQuery(document).ready(function(){ 
    jQuery("#sortedselect6").change(function() { 
     jQuery.post('verwerker.php',{selection:jQuery("select#control6").val()}, function(newSelectdata) { 
     jQuery("select#sortedselect6").html(newSelectdata); 
     }); 
    }); 
}); 

答えて

1

:xDさんは、ここでは、固定のコードです。そのデータは、フィドルに要素が存在するよう

http://jsfiddle.net/up6fG/

は準備ができた場合にあなたのコードをラップしていることを確認し、テストAJAXするために、実際のHTMLを送信する必要があり、単純に起因する若干異なることに注意してください時にコードの火災

私は自分のサイトへの実際のパスに/エコー/ HTML /を変更したときに、私は、あなたのリンクでテストしてきた
$(function(){ 
    /* your code here*/ 

    }) 
+0

、それは – Happy

+0

作業を停止し、私はこれが理由のhttp理解するのに役立つかもしれ – Happy

+0

あなたのラップの提案を試してみましょう://docs.jquery.com/How_jQuery_Works – charlietfl