显示器2个复选框元件

我有一个使用类似下面显示器2个复选框元件

<Form> 
<table> 
    <tr> 
     <td align="left" width="15"><input name="switch" title="0" id="radio17" value="Free Shipping" checked="checked" type="radio" /> 
     </td> 
     <td>Free Shipping</td> 
    </tr> 
    <tr> 
     <td align="left" width="15"><input name="switch" title="38" id="radio18" value="Standard Shipping" type="radio" /> 
     </td> 
     <td>Standard Shipping 
     </td> 
    </tr> 
</table>

，我需要什么一个复选框形式的标题之间的数学差在价格上的差异，它是由标题标记如果免费送货选择输出应该看起来像“免费送货[+ 0]”和标准航运将看起来像“标准送货[+38]”

我刚学来的旁边显示name.So JavaScript，所以这将是首选，但任何事情会做，如果它的作品。

来源

2012-03-28 BulletB

$（ “输入：检查”）{\t \t { VAL = parseInt函数（$（本）.attr（ “标题”））; document.writeIn（val - parseInt（document.getElementById（“radio17”）。title））; } – BulletB 2012-03-28 19:53:47

“要显示在名称旁边”，什么名字？ – 2012-03-28 19:53:48

什么HTML打印出来，即免费送货或标准配送 – BulletB 2012-03-28 19:55:14

你的意思是说像this？

<form> 
    <label><input type="radio" name="switch" title="Free Shipping" id="freeshipping" value="0" checked="checked" type="radio" />Free Shipping</label>  
    <label><input type="radio" name="switch" title="Standard Shipping" id="standardshipping" value="38" />Standard Shipping</label> 
    <div>Selected shipping method: <span id="shippingtitle"> </span> [+<span id="shippingcost"> </span>]</div> 
</form>

window.onload = function(){ 
    var i; 
    for(i = 0; i < document.getElementsByName('switch').length; ++i){ 
     document.getElementsByName('switch')[i].onclick = function(){ 
      document.getElementById('shippingtitle').firstChild.data = this.title; 
      document.getElementById('shippingcost').firstChild.data = this.value; 
     } 
    } 
};

label{ 
    display:block; 
    float:left; 
    clear:left; 
    width:30%; 
} 
form{ 
    max-width:500px; 
}

看来，你只是学习JavaScript。这很好，但如果你想驾驶汽车的话，不要使用直升机（学习基本的JavaScript并在使用jQuery之前阅读关于DOM的一些信息）。

来源

2012-03-28 19:59:58 Zeta

我会通过id访问radio元素，然后更新其父元素的同级元素的文本以包含单选按钮的“title”属性的值。例如：

function showPriceDifference(id) { 
    var el = document.getElementById(id) 
    , price = el.getAttribute('title'); 
    el.parentElement.nextElementSibling.innerHTML += ' [+' + price + ']'; 
} 
showPriceDifference('radio17'); 
showPriceDifference('radio18');

来源

2012-03-28 20:00:03 maerics

显示器2个复选框元件

回答

相关问题