點擊時窗體值消失

Question

我有6個單選按鈕的問題，所以它們編碼爲1,2,3,4,5,99，還有一個輸入逐字回答的文本框。如果已選擇代碼1-5，則文本框中的值將消失，如果選擇代碼99，則文本框中的答案將顯示出來。

但是隻要我在文本框中單擊編輯早些時候逐字輸入，在文本框中的所有文字會消失，文本框的

ID是：Q6_99_other

這裏是腳本：

var txt = ""; 
$('#fieldset_Q6 input').parent().each(function() { 
    $(this).click(function() { 
     //alert('checked'); 

     $('#Q6_99_other').on('keyup change', function() { 
      txt = this.value; 
     }) 

     var id = $(this).children().attr('id'); 
     if (id == 'Q6_1_99') { 
      $('#Q6_99_other').val(txt); 
     } else { 
      $('#Q6_99_other').val(''); 
     } 

    }); 
}); 

任何有任何建議？也許我需要修改腳本的「keyup change」部分？

非常感謝， 羅伊

Answer 1

當你點擊文本框，單擊事件冒泡到父元素。這會運行你所寫的點擊處理程序。由於孩子的ID不是Q6_1_99，所以它執行$('#Q6_99_other').val('')，它清除了文本字段。

您可以防止這種起泡有：

$("#Q6_99_other").click(function(e) { 
    e.stopPropagation(); 
    this.focus(); 
}); 

而且，你可能不應該有keyup change單擊處理程序內綁定。這意味着每次用戶單擊父項時，它都會綁定文本框上的另一個keyup change處理程序。你只需要做一次，而不是每次點擊。只需在頂層document.ready處理程序中執行此操作。

您也不需要使用.each()將處理程序綁定到所有元素。事件綁定函數可以應用於集合，並且jQuery自動迭代它們。