Kan ik jQuery find() voor meer dan één elementtype tegelijk gebruiken?

Ik gebruik de volgende functie om de opvulling in een kolom op mijn formulieren te wijzigen:

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)
            }
        });
}

Het werkt goed voor deze vorm HTML:

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

Nu zou ik ook willen dat het werkt voor de volgende HTML:

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

Is er een manier waarop ik deze functie kan wijzigen zodat deze werkt voor een inputof een textarea? Ik neem aan dat de manier om dit te doen is om var tds = $(this).find('input'),te wijzigen, maar ik weet niet zeker hoe ik dit moet veranderen of zelfs of het mogelijk is om te veranderen in ” find” ofwel een tekstgebied of een invoer.


Antwoord 1, autoriteit 100%

Gebruik een komma om meerdere zoekopdrachten samen te voegen:

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

Je kunt ook :inputgebruiken als selector, maar het is niet zo efficiënt en kan ook enkele dingen bevatten die je liever niet opneemt.


Antwoord 2, autoriteit 2%

U kunt .children()gebruiken om het kind van tdte selecteren, wat het ook is

var tds = $(this).children();

Antwoord 3

Je kunt geen textareatoevoegen met dezelfde idals een ander element. Het is onjuist. id-waarden zijn uniek voor een enkel html-element in het document.

Ik zou je in plaats daarvan classwillen voorstellen.

<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')

Antwoord 4

jQuery( "selector1, selector2, selectorN" )

selector1: Elke geldige selector.
selector2: Een andere geldige selector.
selectorN: zoveel meer geldige selectors als u wilt.
De volgorde van de DOM-elementen in het geretourneerde jQuery-object is mogelijk niet identiek, omdat ze in documentvolgorde staan.
Voorbeeld: vindt de elementen die overeenkomen met een van deze drie selectors.

<!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>

Lees meer

Other episodes