Question

这可能是一个愚蠢的问题，因为我在任何地方都没有找到任何关于我的具体问题的信息，这是我的第一个javascript / html项目。

我想传递一本书的名称及其价格，由id与其关联（book1和price1）。我的想法是这样，如果名称或价格稍后改变，函数“addToCart（book1，price1）”将自动传递更新的名称/价格。是否可以在javascript / html5中以这种方式将字符串传递给函数？

以下是代码的一部分：

<td>
    <span class="bookName" id="book1">
        <b>Artificial Intelligence: Modern Approach</b>
    </span> <br>
    <b>PRICE: $</b> 
    <span id="price1"> 158.55 </span> 
    <button type="button" onclick="addToCart(book1, price1)">Add to cart!</button>
</td>

提前致谢！

Answer 1

HTML

<button type="button" onclick="addToCart('book1', 'price1')">Add to cart!</button>

JS

function addToCart(productId, priceId) {
    // ...
}

关于您的代码的其他几点说明：

使用<br />代替<br>，否则无效HTML
理想情况下使用<label>代码，这样可以更方便地使用

例如

<label for="price1">PRICE:</label>
<span>$</span>
<span id="price1">158.55</span>

通常最好将事件连接到单独的JavaScript文件（或<script>标记）而不是HTML属性。这样可以更加清晰地分离您的功能和标记/ UI

Answer 2

假设你正在使用jquery：

onClick="addToCart($(this).siblings('.bookName').text(), $(this).siblings('.price').text())"

这需要您在价格范围（<span class="price">158.55</span>）上加上一个类。

请记住...... DOM中的每个元素都“知道”它在哪里，您可以在这棵树中向上/向下导航以查找附近的相关元素。

如何通过id传递参数？

2 个答案: