0

ユーザーの場所を設定するために使用される ajax スクリプトがあります。フォーム入力は

<select id="region" onchange="city('/ajax-city.php')" ...>
   <option>

<select ..\>
   <option...>

最初の選択リストのオプションの 1 つが変更されると (onchange)、ajax 要求がサーバーに送信され、応答が処理されて 2 番目<select>が更新されます。

を更新するために使用される関数です。<select>

var city = function(page)
{
    if(xhro){ // stands for Xml Http Request Object
      var fv = document.getElementById('region').value;
      var obj = document.getElementById('city-element');
      obj.innerHTML="<span style=\"display:block; width:200px; float:right; padding:0 10px 10px 0; font-family:Tahoma; font-size:12px;\"> please wait.. </span>";
      xhro.open("POST",page);
      xhro.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
      xhro.onreadystatechange = function()
      {
        if(xhro.readyState==4 && xhro.status==200)
        {
            obj.innerHTML = "<select name=\"city\"  onchange=\"subcity('ajax-subcity.php')\" id=\"city\" >"+xhro.responseText+"</select>";
        }
      }
      xhro.send("city=" + fv);
}

ご覧のとおり、私の関数は onchange イベントがトリガーされたときに別の ajax リクエストを送信するために onchange 属性を追加しますが、<select name="city">firebug の<select name="city">コンソールで次のオプションをクリックすると、このエラーが発生します

subcity is not a function

subcity("ajax-subcity.php");

コンソールに関数を入力すると、firebugがそれを認識します。ajaxリクエストがDOM要素を更新すると、ページが通常ロードされるときのようにイベントが処理されないと思います。

しかし、それは単なる提案であり、関数city()は処理されて更新されます<select name="city>"が、次のレベル( subcity()) では更新が行われないことを考慮してください

s の作成は<option ..>php スクリプトで行います。

問題は subcity() 関数ではなく、firebug で動作するためだと思いますが、言及するのは良いことです。

var subcity = function(page){
alert("problem solved");
if(xhro){
    var fv = document.getElementById('city').value;
    var obj = document.getElementById('subcity-element');
    obj.innerHTML="<span style=\"display:block; width:200px; float:right; padding:0 10px 10px 0; font-family:Tahoma; font-size:12px;\"> please wait</span>";
    xhro.open("POST",page);
    xhro.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
    xhro.onreadystatechange = function(){
        if(xhro.readyState==4 && xhro.status==200){
            obj.innerHTML = "<select name=\"subcity\" id=\"subcity\" >"+xhro.responseText+"</select>";
        }
    }
    xhro.send("city=" + fv);
}
4

1 に答える 1

2

私は引用します：

   if(xhro.readyState==4 && xhro.status==200){
            obj.innerHTML = "<select name=\"subsity\" id=\"subcity\" >"+xhro.responseText+"</select>";
        }

選択で使用するサブシティID を変更してください。「サブシティ」の代わりに「サブシティ」を使用してください。そうしないと、サブシティ機能が上書きされます!!!

ID は javascript で使用されるため、一意である必要があります。、CSSだけではありません。

編集 ：

都市と都市機能についても同じことを行います

PS: あなたのコードは本当に混乱しています! 修理する。

于 2012-05-19T06:49:47.070 に答える