-1

“.each do”循环在 Rails 表单上创建一些 html。
该循环创建具有“foo_1_blah”、“foo_2_blah”等 ID 的复选框，以及其他具有相似开头和 ID 中匹配数字的元素。

使用通配符 ( )，当匹配“ _blah”的这些复选框之一被更改时，如果该复选框的 ID 匹配：

/foo_1_*/

我想 .hide() 一些匹配的输入框：

/foo_1_barx_*/

/foo_1_bary_*/

我不想隐藏（）复选框。在某些语言中，我会做类似的事情

/foo_(\n)_*/

然后我可以用 $1 得到号码并匹配

/foo_($1)_barx*/

/foo_($1)_bary*/

...但不确定如何在 jQuery 或 javascript 中使用 dom-tree 遍历来执行此操作。如果有一种方法可以标记 Rails 表单以启用此功能，那也可以。

4

2 回答 2

1

我结合了 jQuery 和 Javascript 的正则表达式来解决这个问题。这里：http: //jsfiddle.net/HbtjZ/31/

.change() 检测结合了 jquery 选择器以仅检测相关复选框的更改。Javascript 用于从该复选框的 ID 字段中提取数字并构建用于 ID 选择我希望隐藏的文本 div 的字符串（它们实际上是输入框，但在任何一种情况下都由 ID 匹配）。

我没有找到一种方法来正则表达式选择 div 并将它们串联切换，使用类似的东西：

var matchString = 'input:not(:checkbox)[id^="foo_' + myNumber + '_"]' $(matchString).toggle()

这似乎只匹配一个实例 - 复选框，然后根据“不”忽略它；我为每个与 ID 匹配的 div 使用了一个切换线来解决此问题。

这里有一个很好的console.log输出分解来检查进度

脚本：

$(function(){
  $("input[type='checkbox'][id^='foo_']").change(function(){

    foundID = $(this).attr('id')
    console.log('We Found ID ' + foundID);

    var myMatch =  foundID.match(/foo_(\d+)_barx*/);
    var myNumber = myMatch[1]
    console.log('We Found Number ' + myNumber);

    var matchStringA = '#foo_' + myNumber + '_baz'
    var matchStringB = '#foo_' + myNumber + '_bay'  
    console.log('JQ ID String To Match ' + matchStringA + ' and ' + matchStringB);

    $(matchStringA).toggle()
    $(matchStringB).toggle()
  });
});

HTML：

<input type="checkbox" id="foo_1_bar"/>

<div id="foo_1_baz">
Toggle This Visibility With Checkbox #1 Change
</div>

<div id="foo_1_bay">
Toggle This Visibility With Checkbox #1 Change
</div>

<input type="checkbox" id="foo_2_bar"/>

<div id="foo_2_baz">
Toggle This Visibility With Checkbox #2 Change
</div>

<div id="foo_2_bay">
Toggle This Visibility With Checkbox #2 Change
</div>
于 2013-07-10T07:12:54.860 回答
1

在 jQuery 中，我相信$("input:not(:checkbox)[id|=foo_1_bar]").hide()会起作用。

这是选择所有input不是复选框 ( :not(:checkbox)) 并且 id 以 foo_1_bar ( [id|=foo_1_bar]) 开头的标签。我不认为你可以使用通配符，但是 css 选择器可以给你更多的灵活性。在这里和这里查看有关 css 选择器的更多信息。

于 2013-07-09T13:49:21.537 回答