2013-06-27 3 views
0

У меня есть очень простой JQuery clone():JQuery клон() не работает

<script type="text/javascript"> 
    $("#reset").click(function() { 
     location.reload(); 
    }); 
    $("#clone").click(function() { 
     //$('.hq').clone().insertAfter(".hq"); 
     $('.hq').clone().appendTo('.hq'); 
    }); 
</script>       

<div class="hq"> 
    <div class="textboxs"> 
     <select name="hq"> 
       <option value="-1">Select Headquarter</option> 
       <?php for($i = 0; $i < count($get_hq_r); $i++) { ?> 
        <option value="<?php echo $get_hq_r[0]['id']; ?>"><?php echo $get_hq_r[$i]['name']; ?></option> 
       <?php } ?> 
     </select>  
    </div> 
</div> 
<button id="clone">Add more</button> <button id="reset">Reset</button> 

Но когда я нажимаю на кнопку Add more, InstEd клонировать в DIV, он обновите страницу!

+0

Кажется, пытаюсь связать обработчик событий перед тем существуют элементы. Посмотрите http://learn.jquery.com/about-jquery/how-jquery-works/, чтобы узнать, как правильно настроить jQuery. –

ответ

4

Похоже, что ваш button находится внутри формы, поэтому при нажатии он отправит форму. Вы можете остановить его с помощью event.preventDefault() в вашем click обработчика:

$('#clone').click(function(e) { 
    e.preventDefault(); 
    // your code 
}); 
+0

+1 это объясняет обновление страницы –