如何使用内联 jquery 迭代组合框中的响应值？ -姜戈

Posted 2023-02-24

【中文标题】如何使用内联 jquery 迭代组合框中的响应值？ -姜戈

【英文标题】：How to Iterate response value in combobox using inline jquery ? -Django

【发布时间】：2020-11-17 16:47:31

【问题描述】：

我有一个名为 data2 的对象，其中包含多个数据，我将这些数据从 views.py 呈现到我的 html 模板。

% for item in data2 %
<tr>
    <td><input type="text" name="from" class="form-control input_data" value="item.from_age"></td>
    <td><input type="text" name="to" class="form-control input_data" value="item.to_age"></td>
    <td id ="gender_select">
        <script>$(function() $('#gender_select :input').each(function() 
    $("#gender option[data-value='" + 'item.gender' +"']").attr("selected","selected");
    ););</script>
        <select name="gender" id="gender" class="form-control input_data" >
            <option data-value="select" >Select</option>
            <option data-value="male" >Male</option>
            <option data-value="female" >Female</option>
        </select>
    </td>
    <td><a href='' class='remove'><span class=''></span></a></td>
</tr>
% endfor %

在item.gender 中，在第一次迭代中，我的值为“男性”，而在第二次迭代中，我的值为“女性”，因此应该自动选择该值，但 执行上述代码后，我遇到了错误$ is not defined 也看不到这些值。 请让我知道我错在哪里？

【参考方案1】：

您应该将您的 jquery 代码放在以下代码块中：

$(document).ready(function () 
  //rest of your code here
);

这将确保您的代码仅在 jquery 初始化后加载。

还要仔细检查您的 jquery 脚本是否被正确调用。

【参考方案2】：

您的似乎是 javascript 错误，请确保在任何其他 js 脚本之前在标头中导入 jquery

我还建议您将脚本标记移到 for 循环之外，因为最终会导致多个脚本执行相同的操作。

还有一种更简单的方法来设置选择标签Checkout this answer的值

[编辑]

这就是我的处理方式

% for item in data2 %
   <tr>
      <td><input type="text" name="from" class="form-control input_data" value=" item.from_age "></td>
      <td><input type="text" name="to" class="form-control input_data" value=" item.to_age "></td>
      <td id="gender_select">
         // Create custom attribute for reference and add a classattribute for reference
         <select name="gender" id="gender" class="form-control input_data m_select" m_value= item.gender >
           // change data-value => value
           <option value="select">Select</option>
           <option value="male">Male</option>
           <option value="female">Female</option>
        </select>
     </td>
     <td><a href='' class='remove'><span class=''></span></a></td>
  </tr>

 % endfor %

 <script>
    $(".m_select").each((i, el) => 
         $(el).val(el.getAttribute('m_value'));
     );
 </script>

【讨论】：

事情会很容易如果我可以将我的脚本标签移到 for 循环之外但是我如何迭代 data2 对象？

我发布了关于如何解决它的编辑，希望对您有所帮助