選擇的一次表單的動作偵聽器重置

Question

我有一個輸入服務器的形式，選擇&無線電，它偶爾需要重置，所以我使用jQuery功能.trigger('reset')，這工作很好，除了我看起來似乎無法一旦發生這種情況就會觸發一項行動。例如我的<select>'s上的.on("reset")或.on("change")。

看看波紋管的例子;點擊選擇字段並選擇一些內容，然後輸入名稱並單擊重置，該值將重置，但<select>'s上不會調用動作reset或change。

$('select[name="opt"]').on("click reset change",function(){ 
 
    
 
    var selected = $(this).val(); 
 

 
    $(".jobs>div").hide();  // Hide all jobs first. 
 
    $(".jobs>."+selected).show(); // Show selected job. 
 

 
}); 
 

 
$(".reset").on("click",function(){ 
 
    $('form.theff').trigger("reset"); 
 
});

.theff * { 
 
    display:block; 
 
    margin:10px; 
 
} 
 

 
.jobs>div { 
 
    display:none; 
 
    background:gray; 
 
    padding:5px; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<form class="theff"> 
 
    
 
    <input placeholder="Your name.."> 
 
    
 
    <select name="opt"> 
 
     <option selected>Select Job</option> 
 
     <option value="banker">Banker</option> 
 
     <option value="programmer">Programmer</option> 
 
    </select> 
 
    
 
    <div class="jobs"> 
 
     <div class="banker"> 
 
     Really? a banker? 
 
     </div> 
 
     <div class="programmer"> 
 
     Great, your a programmer! 
 
     </div> 
 
    </div> 
 
    
 
    <button>Submit</button> 
 
    <a href="#" class="reset">Reset</a> 
 

 
</form>

Answer 1

形式沒有窗體上的選擇，觸發復位將不觸發事件處理程序設置爲一個完全不同的元件。

你可能想要做

$(".reset").on("click",function(){ 
    $('form.theff').get(0).reset(); 
    $('select[name="opt"]').trigger('change'); 
});