查找等于通过变量传入的 id 的 ID - Jquery

Posted 2023-03-05

【中文标题】查找等于通过变量传入的 id 的 ID - Jquery

【英文标题】：Finding Id that is equal to id passing in with variable - Jquery

【发布时间】：2020-05-07 13:51:10

【问题描述】：

这是它在成功调用 ajax 时执行的代码，其中返回 JSON 数据。我试图迭代数据并将值附加到变量中。然后在比较 fieldType 的 switch 语句中使用这些变量，这将是 Input、Button 或 Select。如果匹配，则附加 fieldValue，或者如果有按钮，则单击字段变量。

数据正在成功返回，如下所示：

    "scenarioDataId": 1,
    "scenarioId": 1,
    "fieldType": "Input",
    "fieldName": "HouseNumberOrName",
    "fieldValue": "28"
  ,

在此示例中，fieldType 等于 Input，fieldName（字段的 id）等于 HouseNumberOrName，fieldValue 等于值 28。我正在尝试比较 fieldType，并根据该类型进行比较例如在 UI 中的输入字段中附加一个值，该字段具有匹配的 id。

function scenarioData(response) 
  $.each(response, function(key, val) 
    var fieldType = val.fieldType;
    var fieldName = val.fieldName;
    var fieldValue = val.fieldValue;

    var field = $(fieldName); //// Here is my issue

    console.log(field);

    if (field != undefined) 
      switch (fieldType) 
        case "Input":
          $(field).val(fieldValue);
          console.log(fieldValue);
          break;
        case "Button":
          $(field).click();
          break;
        case "Select":
          $(field).val(fieldValue);
          break;
      
    
  )

希望这是有道理的，但我想使用变量字段（等于字段 id）在 UI 中查找特定字段。例如，在本例中，有一个名为 House Number 的字段，其 ID 为 HouseNumberOrName。我想将 fieldName 分配给 field，然后使用 field 变量在我的 UI 的 html 中找到相应的 id，然后 switch 语句匹配类型，并在本例中为该字段附加一个值。

如何设置字段变量以查找具有匹配字段名称的 id？

【问题讨论】：

var $field = $("#"+fieldName); ...... $field.val(...)

我不知道我是否理解你的问题，但不是$("#" + fieldName) 用你想要的id 在DOM 中寻找一个元素吗？

输入和输出您期望的结果会有帮助

【参考方案1】：

在使用 jquery id 选择器时需要使用#，然后获取 dom 元素。另外，一旦你获得了 jquery 对象，你就不需要再次将它包装在$() 中，你可以直接使用它来执行 jquery 调用/方法。

注意：在为 jquery 对象声明变量时使用$。这只是一种标准方式，但不是强制性的

见下面的代码

function scenarioData(response) 
                        $.each(response, function(key, val) 
                            var fieldType = val.fieldType;
                            var fieldName = val.fieldName;
                            var fieldValue = val.fieldValue;

                            var $field = $('#'+fieldName); //prepend # for id

                            console.log($field);

                            if(field != undefined) 
                                switch (fieldType) 
                                    case "Input":
                                        $field.val(fieldValue);
                                        console.log(fieldValue);
                                        break;
                                    case "Button":
                                        $field.click();
                                        break;
                                    case "Select":
                                        $field.val(fieldValue);
                                        break;
                                
                            
                        )
                    

【讨论】：

我相信我已经在评论中回答了这个问题。这里没有添加任何新内容。

【参考方案2】：

您要添加#选择器并测试返回对象的长度

$field = $("#"+fieldName);

类似的东西

function scenarioData(response) 
  $.each(response, function(key, val) 
    const [fieldType, fieldName, fieldValue] = val;
    const $field = $("#" + fieldName);
    if ($field.length > 0) 
      if (fieldType === "Input" || fieldType === "Select") 
        $field.val(fieldValue);
       else if (fieldType === "Button") 
        $field.click();
      
    
  )