使两个脚本一起为下拉菜单工作
making two scripts work together for a dropdown menu
我有这个HTML代码
<html>
<head>
<script type="text/javascript">
window.onload = function(){
document.getElementById("shipping-method").onchange = function(){
window.scrollTo(0, 0);
};
};
</script>
<script>
function calc() {
var subtotal = parseFloat(document.getElementById("subtotal").innerHTML.substring(1));
var shipping = parseInt(document.getElementById("shipping-method").value);
if(shipping == 1) {
var total = subtotal+6.95;
document.getElementById("shipping").innerHTML = "$"+6.95;
} else {
var total = subtotal+17.95;
document.getElementById("shipping").innerHTML = "$"+17.95;
}
document.getElementById("total").innerHTML = "$"+total;
}
</script>
</head>
<body>
<select onchange="calc()" class="shipping-method" id="shipping-method">
<option value="">-Choose a shipping method-</option>
<option selected="selected" value="1">normal shipping - $6.95</option>
<option value="2">Priority Shipping - $17.95</option>
</select>
<div class="calculations">
<table>
<tbody><tr>
<td>Subtotal:</td>
<td id="subtotal">$97.00</td>
</tr>
<tr>
<td>Shipping:</td>
<td id="shipping">$6.95</td>
</tr>
<tr class="total">
<td>Total:</td>
<td id="total">$103.95</td>
</tr>
</tbody></table>
</div>
</body>
</html>
下拉菜单是在一个网页的底部,所以我使用第一个脚本让用户在选择其中一个选项并获得总数后页面的顶部,但两个脚本不一起工作,我必须删除其中一个为另一个工作,如何使两个脚本一起工作没有任何冲突,谢谢。
您正在重写onchange函数。如果你想做两件事,那么把它们都放在onchange函数中,不要给它赋值两次。
下面是一些示例代码(为简洁而缩短)。
<html>
<head><title>Example</title></head>
<body>
<select id="shipping-method"></select>
<table></table>
<script type="text/javascript">
function calc() {
// do calculations here
}
document.getElementById("shipping-method").onchange = function(){
window.scrollTo(0, 0); // scroll to top
calc(); // call function
};
</script>
</body>
</html>
请注意,我把javascript放在底部,以避免访问不存在的元素
试试:
function calc() {
var subtotal = parseFloat(document.getElementById("subtotal").innerHTML.substring(1));
var shipping = parseInt(document.getElementById("shipping-method").value);
if(shipping == 1) {
var total = subtotal+6.95;
document.getElementById("shipping").innerHTML = "$"+6.95;
} else {
var total = subtotal+17.95;
document.getElementById("shipping").innerHTML = "$"+17.95;
}
document.getElementById("total").innerHTML = "$"+total;
}
就在函数的顶部:
window.onload = function(){
document.getElementById("shipping-method").onchange = function(){
window.scrollTo(0, 0);
};
相关文章:
- JavaScript下拉菜单-点击按钮并根据所选值重定向到url
- angular的下拉菜单
- 创建带有和不带有JavaScript的Bootstrap下拉菜单
- 创建下拉菜单
- 下拉菜单在菜单按钮的边缘闪闪发光
- I'我设计了一个下拉菜单,onclick会出现,而on blur会消失
- 硒IDE下拉菜单
- 我的下拉菜单中的链接不起作用
- Bootstrap Dropdown selection是在*all*下拉菜单上设置选择
- 如何将JSON转换为HTML下拉菜单
- 悬停下拉菜单即使在鼠标移出后也保持活动状态
- 基于下拉菜单创建开关
- 动态填充两个下拉菜单
- 如何将悬停图像与 Twitter 引导下拉菜单一起使用
- 图像滑块和下拉菜单不能一起工作
- 如何从多选下拉菜单中获取值,并将其与POST一起发送
- Summernote下拉菜单不能与引导导航条一起工作
- 使两个脚本一起为下拉菜单工作
- 下拉菜单不能与JavaScript一起工作
- 自定义下拉菜单不能与链接一起工作