Обновление ДИВ на кнопку мыши, когда кнопка генерируется при нажатии на другую кнопку

При нажатии на кнопку magic1 или magic2, то ДИВ mybox будет обновляться с текстом, идентификатор кнопки и кнопки (различной для magic1 и magic2).Обновление ДИВ на кнопку мыши, когда кнопка генерируется при нажатии на другую кнопку

После нажатия на вновь сгенерированную кнопку он должен отображать идентификатор кнопки только что созданной кнопки в div box. Когда я нажимаю на только что созданную кнопку, box div не обновляется. Вот код.

jquerycode.php является начальным файлом. При нажатии кнопки magic1 или magic2, Ajax вызывается на странице session.php.

jquerycode.php файл

<!doctype html> 
<?php 
$first=$_POST['q']; 
echo $first; 
?> 
<html> 
    <head> 
     <meta charset="utf-8" /> 
     <title>My jQuery Ajax test</title> 
     <style type="text/css"> 
      #mybox { 
       width: 300px; 
       height: 250px; 
       border: 1px solid #999; 
      } 

      #box { 
       width: 300px; 
       height: 250px; 
       border: 1px solid #999; 
       position: absolute; 
       right:210px; 
      } 
     </style> 
     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
     <script>     

      $(document).ready(function(){ 

    $(".magic_button").click(function() { 
     var data = $(this).attr('id'); 
     //alert (data); 
     $.ajax({ 
      type: "POST", 
      url: "session.php", 
      data: { 'id': data } 
     }).done(function(msg) { 
         $("#mybox").html(msg);   
        }); 
    }); 
}); 

     </script> 
     <script> 

     $(".fir").click(function() { 
     var dataa = $(this).attr('id'); 
     alert ("hello"); 
     $.ajax({ 
      type: "POST", 
      url: "jquerycode.php", 
      data: { 'q': dataa } 
     }).done(function(msg) { 
         $("#box").html(msg); 
         return false; 
     }); 
     }); 

     </script> 
    </head> 
    <body> 
     The following div will be updated after the call:<br /> 
     <div id="mybox"> 

     </div> 

     <div id="box"> 

     </div> 

     <form name="magic"> 
    <!-- <label for="name" id="name_label">Name</label> 
    <input type="text" name="name" id="name" size="30" value="" class="text-input" /> 
    <label class="error" for="name" id="name_error">This field is required.</label> --> 
    <input type="button" class="magic_button" name="magic_button" id="magic_button_1" value="magic1" /> 
    <input type="button" class="magic_button" name="magic_button" id="magic_button_2" value="magic2" /> 
</form> 

    </body> 
</html>

session.php файл

<?php 
    $id = $_POST['id']; 
$id = ucwords(implode(' ',explode('_',$id))); 
if($id==="Magic Button 2") 
{ 
    echo "hey its button 2!!"; 
    ?> 

    <input type="button" name="butb" id="second" class="fir" value="second"/> 
    <?php 
} 
else 
{ 
    echo "hey its button 1!!"; 

    ?> 
    <input type="button" name="buta" id="first" class="fir" value="First"/> 

    <?php 
} 
echo $id; 
    ?>

источник

2013-05-04 Ayush Agarwal

Лучше всего, если вы можете использовать JQuery Live() для динамических элементов, порожденных:

$("a.offsite").live("click", function(){ alert("Goodbye!"); });    // jQuery 1.3+

BECA JQuery Живой() является Вам необходимо использовать JQuery on()

$("#elementid").on("click", function(event){ 
alert($(this).text()); 
});

источник

2013-05-04 06:41:02

http://api.jquery.com/on вместо .live() – Blazemonger

вживую осуждается в последней версии JQuery .. – Dinesh

Обновление ДИВ на кнопку мыши, когда кнопка генерируется при нажатии на другую кнопку

ответ

Смежные вопросы