63

我正在使用以下函数来更改表单列中的填充：

function padTitles() {
    $('#option-grid #dataTable tr, #topic-grid #dataTable tr')
        .each(function () {
            var tds = $(this).find('input'),
        text = tds.filter('[id^="input_TempRowKey_"]').val(),
        tdToPad = tds.filter('[id^="input_Title_"]'),
        pad;
            if (/\.0$/.test(text)) {
                pad = 10;
                level = 1;
            } else {
                pad = 35;
                level = 2;
            }
            tdToPad.css('margin-left', pad);
            a = tdToPad.closest('tr');
            if (tdToPad.closest('tr').get().className) {
                tdToPad.closest('tr').get().className = tdToPad.closest('tr').get().className.replace(/\blevel\-.*?\b/g, 'level-' + level);
            } else {
                tdToPad.closest('tr').addClass('level-' + level)
            }
        });
}

它适用于这种形式的 HTML：

<td id="title_1" class=" ">
   <input type="text" value="Tests" name="item.Title" id="input_Title_1" >
</td>

现在我也希望它适用于以下 HTML：

<td id="title_1" class=" ">    
  <textarea name="item.Title" id="input_Title_1">Tests</textarea>
</td>

有没有办法可以更改此功能，使其适用于 aninput或textarea？我认为这样做的方法是进行更改，var tds = $(this).find('input'),但是我不确定如何更改它，或者即使可以更改为“查找”文本区域或输入。

4

4 回答 4

148

使用逗号合并多个查询：

var tds = $(this).find('input, textarea');

您也可以:input用作选择器，但效率不高，并且可能还包含一些您不想包含的内容。

于 2012-07-28T05:07:17.410 回答
3

您可以使用它.children()来选择tds 孩子

var tds = $(this).children();
于 2012-07-28T05:11:01.130 回答
2

您不能添加与另一个元素textarea相同的 a。id它不正确。id值对于文档中的单个 html 元素是唯一的。

我会建议你class。

<input type="text" value="Tests" class="myclass" name="item.Title" id="input_Title_1" >

<textarea name="item.Title" class="myclass" id="input_Title_2">Tests</textarea>

var tds = $(this).find('.myclass')
于 2012-07-28T05:16:04.183 回答
0 
jQuery( "selector1, selector2, selectorN" )

selector1：任何有效的选择器。selector2：另一个有效的选择器。selectorN：尽可能多的有效选择器。返回对象中的 DOM 元素的顺序jQuery可能不相同，因为它们将按文档顺序排列。 示例：查找与这三个选择器中的任何一个匹配的元素。

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>multiple demo</title>
  <style>
  div, span, p {
    width: 126px;
    height: 60px;
    float: left;
    padding: 3px;
    margin: 2px;
    background-color: #eee;
    font-size: 14px;
  }
  </style>
  <script src="https://code.jquery.com/jquery-3.5.0.js"></script>
</head>
<body>
 
<div>div</div>
<p class="myClass">p class="myClass"</p>
<p class="notMyClass">p class="notMyClass"</p>
<span>span</span>
 
<script>
$( "div, span, p.myClass" ).css( "border", "3px solid red" );
</script>
 
</body>
</html>

阅读更多

于 2020-10-13T19:01:03.560 回答