我可以使用jQuery爲那個元素的.change函數中的select元素的id重用嗎？

Question

我有一些選擇，當他們改變價值我存儲在Windows本地存儲的新值。我所有的功能都重複相同的邏輯。有什麼方法可以將這三個結合爲一個。請注意，Windows本地存儲名稱始終與select的元素ID相同。

var store = window.localStorage; 

$('#AccountID') 
    .change(function() { 
     store.setItem('AccountID', $(this).val()); 
    }); 

$('#ExamID') 
    .change(function() { 
     store.setItem('ExamID', $(this).val()); 
    }); 

$('#PageID') 
    .change(function() { 
     store.setItem('PageID', $(this).val()); 
    }); 

Answer 1

我認爲這樣做將是一個CSS類分配到要跟蹤每一個元素，那麼只需綁定一個事件處理程序最簡單的方法。

var store = window.localStorage; 

$('select.tracked').change(function(){ 
    store.setItem($(this).attr('id'), $(this).val()); 
}); 

根據需要調整選擇器以匹配要跟蹤的元素的類型，例如， :input

Answer 2

我可能是在簡化這個（因爲我通常做:)

但是，這可能是一些津協助

$('#AccountID') 
    .change(function() { 
     store.setItem($(this).attr('id'), $(this).val()); 
    }); 

在您使用$(this).val()提取同樣的方式當前元素的值，您可以使用$(this).attr('id')來檢索當前元素的id並將其用作本地存儲的密鑰...

因此，爲了使您的選擇更通用的，你可以簡單地捕獲.change()事件所有選擇元素 -

$('select') 
    .change(function() { 
     store.setItem($(this).attr('id'), $(this).val()); 
    }); 

如果這是你有點太廣，你可以隨時給您的相關選擇要素匹配類或甚至指定所有選擇元素的一個選擇 -

$('#AccountID, #ExamID, #PageID, #anotherSelect, #...')

Answer 3

你可以使用這個元素的ID作爲本地存儲的關鍵，這樣很容易縮短：

var store = window.localStorage; 

$('#AccountID, #ExamID, #PageID').change(function() { 
    store.setItem(this.id, $(this).val()); 
}); 

Answer 4

嘗試

$('#AccountID, #ExamID,#PageID') 
    .change(function() {store.setItem($(this).attr('id'), $(this).val()); 
    });