javascript - name - jquery obtener id click
Evento jQuery no está disparando (2)
Quiero mencionar (porque no encontré ninguna mención de ello en ninguno de los casos de "evento no encendido" que exploré en la web) que existe una posibilidad que podría morderte.
Si usa .remove () para extraer algo temporalmente del DOM y luego reinsertarlo, perderá sus eventos. Lo que debe usar en su lugar es .detach () para conservar los datos y eventos después de la reinserción. Esto puede ser difícil de depurar ya que todo puede parecer normal, y las herramientas de depuración de eventos son incompletas en el mejor de los casos.
(Personalmente los llamaría algo más como .detachAndScrubDataAndEvents () y .detach () , ya que soy un fanático de los nombres descriptivos que ahorran horas de depuración. Para aquellos que encuentran .remove () y .detach () semánticamente y nombres distinguidos de manera significativa ... la paz sea contigo ... PERO estás completamente equivocado.)
Tengo 3 archivos:
- js_json.js -> para mi código json
- javascript.js -> para mi función javascript
- index.php
Aquí el código para js_json.js :
$(function(){
$(''#postTitle'').change(function(){
var title_id = $("#postTitle").val();
$.ajax({
type:"post",
url:"proses.php",
data:"title_id=" + title_id,
dataType:"json",
success:function(data){
body="";
//$.each(data, function(i,n){
//body = n[''body''];
//});
body += "<a href=/"javascript:void(0);/" id=/"pesan/" name="pesan" onClick=/"/">Hola Test</a>";
$(".postBody").empty();
$(".postBody").append(body);
},
error:function(data){
$(".postBody").empty();
$(".postBody").append("NO Post Selected.");
}
});
return false;
});
});
y aquí mi código javascript.js :
$(function (){
$("a[name=pesan]").click(function (){
alert("holalalalalal.....!");
});
});
y aquí el código index.php :
//some code
<body>
<a href="javascript:void(0);" id="pesan" name="pesan">Hola Test 1</a>
Posts : <br />
<select name="title" id="postTitle">
<option value="">Select Post...</option>
<?php
$sql = "SELECT id, title FROM posts ORDER BY title";
$query = mysql_query($sql) or die(mysql_error());
while($rows = mysql_fetch_array($query)){
print(''<option value="'' . $rows[''id''] . ''">'' . $rows[''title''] . ''</option>'');
}
?>
</select>
<br />
Body : <br />
<div class="postBody">
Will show the body of post.
</div>
</body>
</html>
y mi pregunta es:
Cuando hago clic en el enlace "Hola Test 1", funciona y aparece el mensaje. El problema es que, después de hacer clic en la opción de seleccionar, y aparece el enlace "Hola Test", y luego hago clic en ese enlace ("Hola Test"), el mensaje no aparece y no hay errores en Firebug ...
¿Puede alguien explicarme por qué ...? Gracias...
click() solo vinculará el evento para los elementos que existen en la página en el momento click se llama al click (lo mismo vale para on() sin selector, bind() y todos los demás métodos en el grupo de acceso directo para bind; keydown() , change() etc.).
Debido a que su otro elemento se está agregando a través de AJAX un tiempo después , el controlador no está obligado a ello.
Utilice .on() con un selector en su lugar, que vinculará el evento a todos los elementos actuales y futuros que coincidan con el selector.
$(function (){
$(document).on(''click'', ''a[name=pesan]'', function () {
alert("holalalalalal.....!");
});
});
Dado que on() se introdujo en jQuery 1.7, si está utilizando versiones anteriores de jQuery (como las que existían cuando se formuló esta pregunta), puede usar live() o delegate() lugar de on;
$(function (){
$(''a[name=pesan]'').live(''click'', function () {
alert("holalalalalal.....!");
});
});