Question

我在createpost函数中生成了一个称为listingid的随机数，并将其作为输入传递给showproductmodal函数，如下所示。

function creatpost(){
var index;

splitinput.forEach((num, index) => {

     var listingid = (Date.now().toString(36) + Math.random().toString(36).substr(2, 5)).toUpperCase()

    console.log(index)

    return CatalogueDB.ref( splitinput[index]).once('value').then(function(snapshot) {

            var resultcard = `
            <form id="myform${index}">
            <tr class="tr-shadow">
                                                <td>

                                                    <button type="button" class="btn btn-primary btn-md" onclick="postitem(${key},${index},${listingid});">Submit</button>

                                            </td>
                                        </tr>
                                </form>
          `
            container.innerHTML += resultcard;
        })

        .catch(function(error) {
            container.innerHTML += "";

            var errorcard = `
                <form id="myform${index}">

            <tr class="tr-shadow">

                                            <td    style="width: 90px;">
                                            <div id="ItemID${index}">${splitinput[index]}
                                            </div>
                                            <div>
                                                <br>
                                                 <button type="button" class="btn btn-secondary mb-1 btn-sm" data-toggle="modal" data-target="#productModal" onclick="showproductmodal(${splitinput[index]},${index},${listingid})">
                                                    Add Photos
                                                    </button>
                                            </div>

                                            </td>






                                                <td>

                                                    <button type="button" class="btn btn-primary btn-md" onclick="postitem(${splitinput[index]},${index},${listingid})">Submit</button>

                                            </td>
                                        </tr>
                                    </form>
          `
            container.innerHTML += errorcard;

        })
});
})


   function showproductmodal(id, index, listingid) {


      console.log(id,index)
  }

现在的问题是，每当单击该按钮时，就会触发showproductmodal，表明lisitingid未定义

这是控制台错误输出

index.html：1未捕获的ReferenceError：未定义JJLQ23008PJX0         在HTMLButtonElement.onclick（index.html：1）

这是传递到从控制台检索到的showproductmodal的示例参数

showproductmodal（42,0，JJLQ23008PJX0）

为什么即使将listingid传递给函数，它也会引起错误？如何更正此错误，以便可以在showproductmodal中检索listingid？

Answer 1

如果listingid不是名称为JJLQ23008PJX0的变量，则会引发错误。

通常，需要将此类id /值视为字符串，并将其括在引号中，就像这样，我在其中添加了单引号的'

onclick="postitem(${splitinput[index]},${index},'${listingid}')"

某些值类型可以工作，例如数字，布尔型关键字 true / false 等，

Answer 2

您需要引用随机字符串：

<button type="button" class="btn btn-primary btn-md" onclick="postitem(${key},${index},'${listingid}');">Submit</button>

传递给函数的参数不起作用

2 个答案: