Question

我使用input type=button向用户显示{{#each}}的列表，然后单击功能将运行以获取该输入的值，但我未定义。

代码如下：

app.js

app.get('/search',(req,res)=>{

    data.find({}).then(data=>{

        res.render('./search', {data: data});

    });

search.handlebars

     <table class="blueTable" >
            <thead>
             <tr> 
                <th>Name</th>
             </tr>
            </thead>

            <tbody>
        {{#each data}}
                <tr> 
                    <td>       

                        <input class="button" type="button" onclick="recive()"  id="reciver" name="reciver" value="{{Name}}">
                    </td>

                 </tr>

            {{/each}}

            </tbody>
            </table>

         <script>
              function recive(){
                 var reciver = document.getElementById("reciver").value
                 console.log(reciver)
              }
         </script>

Answer 1

为什么在Javascript中未定义？

undefined是全局对象的属性；即它是一个变量在全球范围内。 undefined的初始值是原始值未定义。 ...如果方法或语句也返回未定义，正在评估的变量没有分配的值。

基本上，它不能引用我假设的{{Name}}部分。 将{{Name}}更改为{{this}}

如果您有一个对象，例如名称为People

{
  people: [
    "Yehuda Katz",
    "Alan Johnson",
    "Charles Jolley"
  ]
}

通知{{#each people}}，然后将{{Name}}更改为{{this}}

<ul class="people_list">
      {{#each people}}
        <li>{{this}}</li>
      {{/each}}
</ul>

输出：

<ul class="people_list">
  <li>Yehuda Katz</li>
  <li>Alan Johnson</li>
  <li>Charles Jolley</li>
</ul>

循环浏览每个循环中的项目时，可以选择通过{{@index}}

引用当前循环索引。

{{#each array}}
      {{@index}}: {{this}}
{{/each}}

另外，对于对象迭代，{{@ key}}引用当前键名：

{{#each object}}
  {{@key}}: {{this}}
{{/each}}

Answer 2

     <table class="blueTable" >
        <thead>
         <tr> 
            <th>Name</th>
         </tr>
        </thead>

        <tbody>
    {{#each data}}
            <tr> 
                <td>       
                    <input class="button" type="button" onclick="receive(this)" name="reciver" value="{{Name}}">
                </td>

             </tr>

        {{/each}}

        </tbody>
        </table>

     <script>
          function receive(element){
             var receiver = element.value
             console.log(receiver)
          }
     </script>

从#each输入列表中获取特定用户

2 个答案: