2015-06-04 113 views
0

我想在我附加的div上使用JQuery.click,但點擊根本不起作用。這裏是代碼,我已經嘗試了其他教程,我可以在互聯網上找到的幫助,但它沒有奏效。jquery點擊不起作用追加

這裏是jQuery的(很簡單的版本):

$(document).ready(function() { 
$("#DivResult").click(function() { 

    alert('yolo'); 
//$("#return").submit(); 
}); 
}); 

而創建我的使用Ajax DivResult並追加方式:

$(document).ready(function() { 
    $('#monForm').on('submit', function (e) { 
     e.preventDefault(); 
     var $this = $(this); 
     var adrall = $('#villeDepart').val(); 
     var adrarr = $('#villeArrivee').val(); 
     var datedepart = $('#datedepart').val(); 
     var nombreplace = $('#nombreplace').val(); 
     $.getJSON('/app.php/rechT/refresh', {data: adrall + ' , ' + adrarr + ' , ' + datedepart + ' , ' + nombreplace} 
     ).done(function (Res) { 
      console.log(Res); 
      $("#resultcontainer").html(""); 
      if (Res == "") { 
       secondchoix(); 
       tiercechoix(); 
      } 
      else { 
       $.each(Res, function (ligne, result) { 
        var resultats = 
          "<div class=" + '"output container col-lg-8 blueskycont col-lg-offset-2"' + ' id="DivResult"'+ 
          ">" + " <form name=" + '"retour"' + " action=" + 
          '"/app.php/validationdemande/go"' + "role=" + '"form"' + " method=" + '"POST"' + " class=" + '"retour"' + ' id="return"'+ 
          "> <div class=" + '"form-group col-lg-12 col-md-12 col-xs-sm-12 col-xs-12"' + ">" + 
          "<label class=" + '"funzies col-lg-12 col-md-12 col-xs-sm-12 col-xs-12 move"' + " for=" + '"pwababd"' + ">" + result.TRAJ_LIEU_DEP + " -> " + result.TRAJ_LIEU_ARR + "</label>" + 
          " <label class=" + '"funzies col-lg-12 col-md-12 col-xs-sm-12 col-xs-12"' + "> Départ le : " + result.TRAJ_DATE + "</label> " + 
          " <label class=" + '"funzies col-lg-12 col-md-12 col-xs-sm-12 col-xs-12"' + "> De : " + result.PROT_LIEU_DEP + "</label> " + "</br>" + 
          " <label class=" + '"funzies col-lg-12 col-md-12 col-xs-sm-12 col-xs-12"' + "> " + result.PROT_LIEU_ARR + "</label> " + "</br>" + 
          " <label class=" + '"funzies col-lg-12 col-md-12 col-xs-sm-12 col-xs-12"' + "> A : " + result.TRAJ_NB_PLACE + " places restante(s) </label> " + "</br>" + 
          "<label class=" + '"funzies col-lg-2 col-md-2 col-xs-sm-2 col-xs-2"' + "> " + result.PROF_PRENOM + " " + result.PROF_NOM + " </label> " + 
          "<input type=" + '"HIDDEN" class="" id="" name="PROT_ID" value="' + result.PROT_ID + '">' + 
          "<input type=" + '"HIDDEN" class="" id="" name="PROT_RED" value="' + result.PROT_RED + '">' + 
          "<input type=" + '"HIDDEN" class="" id="" name="TRAJ_TYPE" value="' + result.TRAJ_TYPE + '">' + 
          "<input type=" + '"HIDDEN" class="" id="" name="VILLE_DEP" value="' + result.TRAJ_LIEU_DEP + '">' + 
          "<input type=" + '"HIDDEN" class="" id="" name="VILLE_ARR" value="' + result.TRAJ_LIEU_ARR + '">' + 
          "<input type=" + '"HIDDEN" class="" id="" name="LIEU_DEP" value="' + result.PROT_LIEU_DEP + '">' + 
          "<input type=" + '"HIDDEN" class="" id="" name="LIEU_ARR" value="' + result.PROT_LIEU_ARR + '">' + 
          "<input type=" + '"HIDDEN" class="" id="" name="nombreplace" value="' + nombreplace + '">' + 
          "<input type=" + '"HIDDEN" class="" id="" name="demande_ville_dep" value="' + adrall + '">' + 
          "<input type=" + '"HIDDEN" class="" id="" name="demande_ville_arr" value="' + adrarr + '">' + 
          "</div> </form> </div>"; 

        $("#resultcontainer").append(
          resultats 
          ); 
       }); 
      } 
     }) 
       .fail(function (Res) { 
        alert('fail');   
       }) 
       .error(function (Res) { 
        alert('erreur'); 
       }); 
    }); 
}); 

我試圖使用它,因爲提交:onClick="document.forms[\'retour\'].submit();" 在IE上不起作用。

但是,該命令在DivResult上完全沒有響應。這是否意味着我不能在我追加的div上使用Jquery.click?

+0

其實''.click()'模擬點擊。使用'.on(「click」,function(){//不管你想要什麼});'或'.onMouseDown(function(){//不管你想要什麼});',但是我會優先考慮第一個。 – Seblor

回答

2

您需要事件代表團!

$("#resultcontainer").on("click", "#DivResult", function() { 

}); 

處理程序在運行時綁定 - 因爲你的元素不存在,所以沒有處理程序被綁定。這將檢查#resultcontainer每次點擊#DivResult並運行處理程序(如果找到)。

+0

非常感謝我永遠不會發現自己...即使在IE瀏覽器上也能很好地工作!非常感謝你:) –

0

嘗試在大結果函數底部添加yolo部分。我的理論是當你調用'onclick'時,你的DivResult還不存在:

$(document).ready(function() { 
    $('#monForm').on('submit', function (e) { 
     e.preventDefault(); 
     var $this = $(this); 
     var adrall = $('#villeDepart').val(); 
     var adrarr = $('#villeArrivee').val(); 
     var datedepart = $('#datedepart').val(); 
     var nombreplace = $('#nombreplace').val(); 
     $.getJSON('/app.php/rechT/refresh', {data: adrall + ' , ' + adrarr + ' , ' + datedepart + ' , ' + nombreplace} 
     ).done(function (Res) { 
      console.log(Res); 
      $("#resultcontainer").html(""); 
      if (Res == "") { 
       secondchoix(); 
       tiercechoix(); 
      } 
      else { 
       $.each(Res, function (ligne, result) { 
        var resultats = 
          "<div class=" + '"output container col-lg-8 blueskycont col-lg-offset-2"' + ' id="DivResult"'+ 
          ">" + " <form name=" + '"retour"' + " action=" + 
          '"/app.php/validationdemande/go"' + "role=" + '"form"' + " method=" + '"POST"' + " class=" + '"retour"' + ' id="return"'+ 
          "> <div class=" + '"form-group col-lg-12 col-md-12 col-xs-sm-12 col-xs-12"' + ">" + 
          "<label class=" + '"funzies col-lg-12 col-md-12 col-xs-sm-12 col-xs-12 move"' + " for=" + '"pwababd"' + ">" + result.TRAJ_LIEU_DEP + " -> " + result.TRAJ_LIEU_ARR + "</label>" + 
          " <label class=" + '"funzies col-lg-12 col-md-12 col-xs-sm-12 col-xs-12"' + "> Départ le : " + result.TRAJ_DATE + "</label> " + 
          " <label class=" + '"funzies col-lg-12 col-md-12 col-xs-sm-12 col-xs-12"' + "> De : " + result.PROT_LIEU_DEP + "</label> " + "</br>" + 
          " <label class=" + '"funzies col-lg-12 col-md-12 col-xs-sm-12 col-xs-12"' + "> " + result.PROT_LIEU_ARR + "</label> " + "</br>" + 
          " <label class=" + '"funzies col-lg-12 col-md-12 col-xs-sm-12 col-xs-12"' + "> A : " + result.TRAJ_NB_PLACE + " places restante(s) </label> " + "</br>" + 
          "<label class=" + '"funzies col-lg-2 col-md-2 col-xs-sm-2 col-xs-2"' + "> " + result.PROF_PRENOM + " " + result.PROF_NOM + " </label> " + 
          "<input type=" + '"HIDDEN" class="" id="" name="PROT_ID" value="' + result.PROT_ID + '">' + 
          "<input type=" + '"HIDDEN" class="" id="" name="PROT_RED" value="' + result.PROT_RED + '">' + 
          "<input type=" + '"HIDDEN" class="" id="" name="TRAJ_TYPE" value="' + result.TRAJ_TYPE + '">' + 
          "<input type=" + '"HIDDEN" class="" id="" name="VILLE_DEP" value="' + result.TRAJ_LIEU_DEP + '">' + 
          "<input type=" + '"HIDDEN" class="" id="" name="VILLE_ARR" value="' + result.TRAJ_LIEU_ARR + '">' + 
          "<input type=" + '"HIDDEN" class="" id="" name="LIEU_DEP" value="' + result.PROT_LIEU_DEP + '">' + 
          "<input type=" + '"HIDDEN" class="" id="" name="LIEU_ARR" value="' + result.PROT_LIEU_ARR + '">' + 
          "<input type=" + '"HIDDEN" class="" id="" name="nombreplace" value="' + nombreplace + '">' + 
          "<input type=" + '"HIDDEN" class="" id="" name="demande_ville_dep" value="' + adrall + '">' + 
          "<input type=" + '"HIDDEN" class="" id="" name="demande_ville_arr" value="' + adrarr + '">' + 
          "</div> </form> </div>"; 

        $("#resultcontainer").append(
          resultats 
          ); 
       }); 
      } 
     }) 
       .fail(function (Res) { 
        alert('fail');   
       }) 
       .error(function (Res) { 
        alert('erreur'); 
       }); 
    }); 

    $("#DivResult").click(function() { 
     alert('yolo'); 
//$("#return").submit(); 
    }); 
}); 
+0

我不知道我是否理解你的觀點,但是我認爲這是因爲我的活動代表團的其他答案有效。我想我沒有用好聽衆 –