我想使用 Jquery .change(function... (JS, EJS, Mongoose, Express) 显示数组中的特定项目

Posted 2023-02-19

【中文标题】我想使用 Jquery .change(function... (JS, EJS, Mongoose, Express) 显示数组中的特定项目

【英文标题】：I want to display a specific item from an array using Jquery .change(function... (JS, EJS, Mongoose, Express)

【发布时间】：2021-11-06 03:16:24

【问题描述】：

在我的项目中使用的是 js、ejs、mongoose、express

我想使用 Jquery 显示数组中的特定项目。

我有一个选择元素，每次更改此元素时，我都想提取它的选项值，将其解析为整数“i”，将其放在另一个数组中并在我的 html 中显示特定的数组 [i]文件

关于我的项目的更多信息：我在选择元素中有一个项目列表（这些项目是来自浏览器的输入）。每件商品都有自己的价格（这也是来自浏览器的另一个输入），并且希望将每件商品与自己的价格相匹配。

例如，选择项目[1] 更改为价格[1]，选择项目[2] 更改为价格[2]

这是我的代码： '''

<li class="list-group-item" id="price">
<% let array = kiteProduct.price.split(','); %> 
 €  
</li>

<select class="form-select" id="sizes" aria-label="Default select example">
   <option value="0" selected>Select Size</option>
   <% let i = 0; %> 
   <% for (let element of kiteProduct.size.split(',')) %>
   <option value=<%= i %> >
   <%= element %>

   </option>
   <% i++ %> 
   <%  %>
</select>

''' 和我的 jQuery '''

   <script type='text/javascript'>
                $('#sizes').change(function () 
                    
                    var $arr = "<%=array; %>";
                    var $id = parseInt($(this).val());
                    // let price = arr[id];
                    var i = 0;
                    for (let j of $arr)
                        if (i === $id)
                            var price = j;
                        
                        i++;
                    
                    $("#price").text(price);
                );
            </script>

''' 我也试过 '''

<script type='text/javascript'>
                $('#sizes').change(function () 
                    
                    var $arr = "<%=kiteProduct.size.split(',') %>";
                    var $id = parseInt($(this).val());
                    let price = arr[id];
                    $("#price").text(price);
                );

'''

当我将 id 传递给我的价格时，我的函数可以完美运行 $("#price").text($id);，但是当我将我的 id 传递给我的数组时，它会显示我的 id（例如 0、1...），正如我在代码中提到的，我的代码显示的随机值 (eg item[0] -> html text "1", item[1] -> html text "0"

我已经包含了我的脚本 '''

            <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
            <script src="https://code.jquery.com/jquery-1.12.3.min.js"></script>
            <script src="ejs.min.js"></script>

'''

我相信我只需要ajax，其他的都是不必要的

【参考方案1】：

我通过更改选项值找到了一个简单的答案 <option value=<%= array[i] %> >

如果你发现了我可以在 jQuery 上使用的其他东西，请告诉我并发布你的答案！