使用 jQuery 在增量 ID 输入之间迭代

Question

我的 HTML 中有一些输入具有 ID，例如 element1、element2、element3、...elementN

如果我想在每个元素上使用选择器，我不想像这样为每个元素创建一个选择器：$("#element1") 有没有一种方法可以使用 for 循环来迭代在 element1 和 elementN 之间使用 jQuery？

编辑：我需要像这样使用另一个增量 ID 执行验证

var X1 = $("#element1").val();
var X2 = $("#anotherElement1").val();
if (X1 == X2)
{ 
//do something
}

Edit2（添加上下文）

<input data-val="true" data-val-number="The field Element1 must be a 
number." id="Element1 " max="1000" min="0" name="EnergyAt1" step="0,1" type="text" value="18,3" 
data-role="numerictextbox" role="spinbutton" aria-valuemin="0" 
aria-valuemax="1000" 
class="k-input" aria-valuenow="18,3" aria-disabled="false" style="display: none;">

<input data-val="true" data-val-number="The field AnotherElement1 must be a 
number." id="AnotherElement1 " max="1000" min="0" name="EnergyAt1" step="0,1" 
type="text" value="18,3" data-role="numerictextbox" role="spinbutton" aria- 
valuemin="0" aria-valuemax="1000" class="k-input" aria-valuenow="18,3" aria- 
disabled="false" style="display: none;">

我需要做的是绑定到我的提交按钮的函数，该函数检查 1 和 N 之间的每个元素是否 ( ElementX.val() != 0 && AnotherElementX == 0) 阻止提交的形式。

Answer 1

假设每个以 element 开头的 ID 都是您想要的 select，您可以使用 select 或字符串 [id^="element"]，这将 select id 以 element 开头的所有内容：

$('[id^="element"]').each(function() {
  console.log($(this).text());
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="element1">e1</div>
<div id="element2">e2</div>
<div id="element3">e3</div>
<div id="element4">e4</div>

但如果可能的话，请改用类 - id 在这种情况下不太合适：

$('.element').each(function() {
  console.log($(this).text());
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="element">e1</div>
<div class="element">e2</div>
<div class="element">e3</div>
<div class="element">e4</div>

Answer 2

由于多种原因，我无法按照推荐使用类，我最终在同事的帮助下围绕我的用例构建了一个 for 循环，代码如下：

function checkIfAnotherElementIsZero(e) {
        var canSubmit = true;
        for (let i = 1; i <= 24; i++)
        {
            if ($("#Element" + i).val() != 0 && $("#AnotherElement" + i).val() == 0) 
            {
                alert('Error');
                canSubmit = false;
                break;
                e.preventDefault();
            }
        }
        if (canSubmit == true)
        {
             $( "input[name=Date]" ).addClass( "data-val-ignore" );
             $( "#@ContextControllerName" ).submit();
        }
        else
        {
            e.preventDefault();
        }
    }

使用 jQuery 在增量 ID 输入之间迭代

Iterate between incremental ID inputs using jQuery

javascript

jquery

for-loop

jquery-selectors