如何使用jQuery获取属性值并从结果中提取子串

Question

我有一个文本输入的列表，其值基于某些选择输入的值进行操作。两组输入有具有平行结构的ID，如：

<select id="foo-dog-bar>, <input type="text" id="foo-dog-baz> 
<select id="foo-cat-bar>, <input type="text" id="foo-cat-baz> 
<select id="foo-fish-bar>, <input type="text" id="foo-fish-baz> 
<select id="foo-bird-bar>, <input type="text" id="foo-bird-baz> 

为了能够找到匹配的文本输入，我需要搜索与对应ID的选择输入。在上面的例子中，这是中间有相同动物名称的ID。

这里是我到目前为止，我的问题是怎么办的criteria变量：

jQuery('select[id$="-points"]').change(function() { 

    var value = jQuery(this).val(), 
     arr = ['cat', 'dog', 'fish', 'bird'], 
     criteria = jQuery(this)..., // whichever string in arr its ID contains 
     bar = jQuery(this).parent().find('#foo-'+criteria+'-bar').val(); 

    // do stuff... 

}); 

如何搜索的this的ID为包含arr数组中的字符串，使该字符串criteria变量？在搜索这种类型的东西时我能找到的唯一东西是检索数组项目的索引，但是这对我并没有帮助。我想要实际的字符串。

在此先感谢。

Answer 1

1. 以选择HTML标签的ID属性值

   criteria = jQuery(this).attr('id'); // just call an .attr('id'); 
   

2. 要通过ID与jQuery选择元素 - 就像用纯JS（JavaScript的），你不需要内嵌套找到元素元件ID是每个DOM/PAGE一个唯一的元件

   jQuery('#foo-'+criteria+'-bar').val(); 
   

3. 可以使用分裂函数从字符串得到值：

   criteria = criteria.split('foo-')[1].split('-baz')[0];

完整的示例：

jQuery('select[id$="-points"]').change(function() { 
     var value = jQuery(this).val(), 
     arr = ['cat', 'dog', 'fish', 'bird']; 
     criteria = jQuery(this).attr('id'); 
     criteria = criteria.split('foo-')[1].split('-baz')[0]; // get the value you want using split() function 
     bar = jQuery('#foo-'+criteria+'-bar').val(); 
     // do other stuff... 
    });