[英]Using JavaScript or jQuery, how do I check if select box matches original value?
Just wondering if there is any way to check if the value of a select box drop-down matches the original value at the time of page load (when the value was set using selected = "yes"
) ? 只是想知道是否有办法检查选择框下拉列表的值是否与页面加载时的原始值匹配(当使用
selected = "yes"
设置值时)?
I guess I could use PHP to create the original values as JavaScript variables and check against them, but there are a few select boxes and I'm trying to keep the code as concise as possible! 我想我可以使用PHP将原始值创建为JavaScript变量并检查它们,但是有一些选择框,我试图让代码尽可能简洁!
That's not too hard at all. 这根本不是太难。 This will keep track of the value for each
select
on the page: 这将跟踪页面上每个
select
的值:
$(document).ready(function() {
$("select").each(function() {
var originalValue = $(this).val();
$(this).change(function() {
if ($(this).val() != originalValue)
$(this).addClass('value-has-changed-since-page-loaded');
else
$(this).removeClass('value-has-changed-since-page-loaded');
});
});
});
This will apply a new class value-has-changed-since-page-loaded
(which presumably you'd rename to something more relevant) to any select box whose value is different than it was when the page loaded. 这会将一个新的类
value-has-changed-since-page-loaded
(可能是您重命名为更相关的内容)到任何选择框,其值不同于加载页面时的值。
You can exploit that class whenever it is you're interested in seeing that the value has changed. 只要您有兴趣看到值已更改,就可以利用该类。
$(document).ready(function() {
var initialSelectValue = $('#yourselect').val();
// call this function when you want to check the value
// returns true if value match, false otherwise
function checkSelectValue() {
return $('#yourselect').val() === initialSelectValue;
}
});
PS. PS。 You should use
selected="selected"
not selected="yes"
. 你应该使用
selected="selected"
not selected="yes"
。
On page load, create an array with the initial value of each select box indexed by name: 在页面加载时,创建一个数组,其中每个选择框的初始值由name索引:
var select_values = [];
$(document).ready(function() {
$("select").each(function() {
select_values[$(this).attr('name')] = $(this).val();
});
});
later when you need to check if a value has changed: 稍后当您需要检查值是否已更改时:
function has_select_changed(name) {
return $("select[name="+name+"]").val() != select_values[name];
}
First, a snippet: 首先,一个片段:
$('select').each(
function(){
if( this.options[ this.selectedIndex ].getAttribute('selected') === null ){
alert( this.name +' has changed!')
}
});
Now the explanation: 现在说明一下:
Assuming selectElement is a reference to a <select /> elementYou can check which option is selected using 假设selectElement是对<select />元素的引用您可以检查使用哪个选项
selectElement.selectedIndex
To get the <option /> element which is currently selected, use 要获取当前选中的<option />元素,请使用
selectElement.options[ selectElement.selectedIndex ]
Now when you know which option element is selected you can find out if this element has the selected='selected' attribute (as in the source code, it doesn't change - this is not the same as .selected propery of a DOM node, which is true for the currently selected option element and changes when the selection is changed) 现在,当您知道选择了哪个选项元素时,您可以确定此元素是否具有selected ='selected'属性(如源代码中所示,它不会更改 - 这与DOM节点的.selected属性不同,对于当前选定的选项元素为true,并在选择更改时更改)
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.