调整脚本以使用多个按钮

时间:2015-05-26 00:28:52

标签: javascript button

我有一个脚本,当用户点击按钮时会打开一本书。如何才能使这个按钮工作?目前只有第一个按钮有效。

此代码位于文档的head

<script type="text/javascript">
function submit_custom_form() {
    product_id = document.getElementById("product-size-selection").value;
    if(product_id) {
        var params = "";
        // call and api library function to go to the software
        Pixfizz.createBook(product_id, params)
    } else {
        alert("Please select a product from the dropdown");
    }
}
</script>

此代码位于body

<div style="display: block; text-align: center;">
    <select id="product-size-selection" name="product-size-selection" style="margin: auto; font-family: formata; color: white; background-color: grey;">
        <option selected="selected" value="">Choose Your Size</option>
        <option value="ACRYLICCOMBOCOVER6X8:6X8COMBOCOVER">6x8 Custom Acrylic Cover</option>
        <option value="CUSTOMCOVER8X6:8X6FULLCOVER">8x6 Custom Satin Cover</option>
        <option value="ACRYLICCOMBOCOVER8X8:8X8COMBOCOVER">8x8 Custom Acrylic Cover</option>
        <option value="ACRYLICCOMBOCOVER9X12:9X12COMBOCOVER">9x12 Custom Acrylic Cover</option>
    </select>
</div>
<div style="text-align: center;">
   <button onclick="javascript:submit_custom_form()">Create My Album</button>
</div>

1 个答案:

答案 0 :(得分:0)

在我看来,您正试图通过document.getElementById访问按钮。

不幸的是,id属性只能应用于单个DOM元素。这意味着如果您在多个HTML代码中定义了相同的ID,则无法获得预期的结果。

将其更改为类选择器并使用document.getElementsByClassName