- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我仍在学习 js,并且再次陷入困境,我正在尝试添加 2 个下拉菜单值并将它们总计在一个 innerHTML 中。
我试图从电话/设备(项目)中获取值2,然后添加新激活(项目1)下拉列表中的值,并将它们总计到佣金innerHTML中。在js中,佣金行是cost。
我尝试在成本行中添加该元素,但没有成功。还尝试将项目本身添加到成本行中。
这是html和js
<table width="50%" border="0">
<tr>
<td width="20%"><div align="center">item</div></td>
<td width="20%"><div align="center">New Activation</div></td>
<td width="20%"><div align="center">Commission</div></td>
<td width="20%"><div align="center">Price</div></td>
<td width="20%"><div align="center">MEID</div></td>
<td width="20%"><div align="center">Number</div></td>
</tr>
<td><div class="styled" align="center">
<select name="item" id="item">
<option value="">Phones/Devices</option>
<option value="">-----APPLE-----</option>
<option value="200.00" value2="20.00" value3="iPhone4">iPhone 4 8GB</option>
<option value="225.00" value2="20.00" value3="iPhone416">iPhone 4 16GB</option>
<option value="250.00" value2="20.00" value3="iPhone432">iPhone 4 32GB</option>
<option value="275.00" value2="20.00" value3="iPhone464">iPhone 4 64GB</option>
<option value="300.00" value2="20.00">iPhone 4S 8GB</option>
<option value="325.00" value2="20.00">iPhone 4S 16GB</option>
<option value="350.00" value2="20.00">iPhone 4S 32GB</option>
<option value="375.00" value2="20.00">iPhone 4S 64GB</option>
<option value="400.00" value2="20.00">iPhone 5</option>
<option value="500.00" value2="30.00">iPhone 5C</option>
<option value="625.00" value2="30.00">iPhone 5S</option>
<option value="">-----BlackBerry-----</option>
<option value="75.00" value2="5.00">Curve</option>
<option value="100.00" value2="5.00">Bold</option>
<option value="225.00" value2="10.00">Q10</option>
<option value="250.00" value2="10.00">Z10</option>
<option value="">-----HTC-----</option>
<option value="100.00" value2="5.00">Incredible</option>
<option value="150.00" value2="5.00">Incredible 2</option>
<option value="150.00" value2="5.00">Evo</option>
<option value="125.00" value2="5.00">Evo Shift</option>
<option value="200.00" value2="10.00">Evo LTE</option>
<option value="175.00" value2="10.00">Rhyme</option>
<option value="225.00" value2="10.00">Rezound</option>
<option value="400.00" value2="20.00">DNA</option>
<option value="450.00" value2="20.00">HTC One</option>
<option value="600.00" value2="20.00">HTC One M8</option>
<option value="">-----Huawei-----</option>
<option value="100.00" value2="5.00">Ascend Y</option>
<option value="150.00" value2="5.00">Ascend Plus</option>
<option value="">-----LG-----</option>
<option value="50.00" value2="5.00">Optimus Dynamic</option>
<option value="100.00" value2="5.00">Optimus Zip</option>
<option value="75.00" value2="5.00">Vortex</option>
<option value="100.00" value2="5.00">Enlighten</option>
<option value="250.00" value2="10.00">Lucid</option>
<option value="200.00" value2="10.00">Revolution</option>
<option value="250.00" value2="10.00">Spectrum</option>
<option value="450.00" value2="20.00">G2</option>
<option value="">-----Motorola-----</option>
<option value="100.00" value2="5.00">Droid 2</option>
<option value="175.00" value2="5.00">Droid 3</option>
<option value="200.00" value2="10.00">Droid 4</option>
<option value="225.00" value2="10.00">Bionic</option>
<option value="250.00" value2="10.00">Razr</option>
<option value="275.00" value2="10.00">Razr Maxx</option>
<option value="300.00" value2="10.00">Razr HD</option>
<option value="350.00" value2="20.00">Moto X</option>
<option value="300.00" value2="20.00">Moto G</option>
<option value="350.00" value2="20.00">Droid Ultra</option>
<option value="">-----SAMSUNG-----</option>
<option value="200.00" value2="10.00">Galaxy Stellar</option>
<option value="250.00" value2="10.00">Galaxy Stratosphere 2</option>
<option value="225.00" value2="10.00">Galaxy Nexus</option>
<option value="225.00" value2="5.00">Epic 4G</option>
<option value="250.00" value2="10.00">Galaxy S2</option>
<option value="300.00" value2="20.00">Galaxy S3</option>
<option value="450.00" value2="20.00">Galaxy S4</option>
<option value="650.00" value2="30.00">Galaxy S5</option>
<option value="450.00" value2="20.00">Galaxy Note ll</option>
<option value="600.00" value2="30.00">Galaxy Note lll</option>
</select>
</div></td>
<td><div class="styled" align="center">
<select name="item1" id="item1">
<option value="">New Activation?</option>
<option value="5.00">YES</option>
<option value="0.00">NO</option>
</select>
</div></td>
<span style="visibility:hidden;display:none;" id="phones"></span>
<td><div align="center">
<span id="cost"></span>
</div></td>
<td><div align="center">
<span id="price"></span>
</div></td>
<td>
<div align="center">
<input name="meid" type="Text" id="meid"/>
</div>
</td>
<td>
<div align="center">
<input name="number" type="Text" id="number"/>
</div>
</td>
</tr>
和 JavaScript
var item = document.getElementById('item');
var item1 = document.getElementById('item1');
item.onchange = function() {
price.innerHTML = "$" + this.value;
cost.innerHTML = "$" + (this[this.selectedIndex].getAttribute('value2'));
phone.innerHTML = "" + (this[this.selectedIndex].getAttribute('value3'));
};
和here是一个jsfiddle
在修改了这个修改后的脚本后,我认为这是一条无法正常工作的行
var commission = +phoneEl.getAttribute("value2");
我不知道出了什么问题。 http://jsfiddle.net/3zf8G/4/
最佳答案
这里:
var phoneEl = document.getElementById('item');
var activationEl = document.getElementById('item1');
function updatePrice() {
var phonePrice = +phoneEl.value;
price.innerHTML = "$"+phonePrice;
}
function updateCommission() {
var commission = +phoneEl.options[phoneEl.selectedIndex].getAttribute("value2"),
activationPrice = +activationEl.value,
totalCommission = commission + activationPrice;
cost.innerHTML = "$" + totalCommission;
}
phoneEl.onchange = function() {
updatePrice();
updateCommission();
};
activationEl.onchange = function() {
updatePrice();
updateCommission();
};
fiddle :http://jsfiddle.net/3zf8G/5/
您没有将 value
和 value2
属性中存储的值转换为数字;您可以通过在字符串前面加上 +
将字符串解析为数字。而且您没有关注激活下拉列表的变化。变量phone
也没有定义。为了清楚起见,我更改了您的变量名称。
关于javascript - 添加 2 个值并将它们合计在一个 innerHTML 中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24420292/
我有一个非常简单的函数,用于替换元素的innerHTML。我已经尝试调试这个问题几个小时了,但就是做不到,这令人恼火。 当从按钮调用时,按下 JavaScript(如下)可以正常工作,但是当从另一个函
我正在开发的代码片段有四个带有 javascript 的内部 html,现在我的问题是我们能否从所有这些数据中获取所有这些数据并添加(如果是整数)它们或连接(如果是字符串)并显示在另一个 div 标签
我正在使用 [innerHTML]显示一个字符串。字符串由同一对象的两个属性组成。该对象来自将对象列表(来自 NgRx 的 Observable)传递给 *ngFor .此外,管道用于决定应该在 [i
首先,我对编码完全陌生,并且一直在空闲时间使用自学工具学习 Javascript。我已经学到了足够的知识来开始构建自己的项目。我的第一次尝试是构建一个随机发生器(在本例中为随机餐厅名称)。 Javas
如题,这些span元素在浏览器中以两种样式显示,为什么? function loadHTML() { var html = 'sfdssfds';
我有一个格式如下的 HTML 文件: subject detail important subject detailimportant 我写了一个 PHP 代码来自动获取每个 p1 并将它们插入到我的
我希望这个主题符合问题。 嘿,请原谅我的笨蛋,但我一直在绞尽脑汁地试图解决这个问题。 代码: chapter 1';">Wonderful 我想要的是显示一个名为“Wonderful”的链接,
我正在调用一个打印到 div 的函数,然后返回一个也打印到 div 的字符串。以下将只打印“二”,但我期待它先打印“一”再打印“二”: global_cdiv = "view" fu
我有一个 不是 contentEditable 的 div。我捕获击键,将关联的字符插入到内存中的字符串中,然后调用 render() 函数用当前字符串替换 div 的 innerHTML。 我的问题
假设我们在页面上有一个 DIV x,我们想将那个 DIV 的内容复制(“复制粘贴”)到另一个 DIV y 中。我们可以这样做: y.innerHTML = x.innerHTML; 或使用 jQuer
我正在尝试根据 javascript 函数填充的数字更改 div 的innerHTML。不幸的是,我收到了一个错误,但我不确定为什么。 伪代码 如果number > 2将innerHTML更改为秒,否
我正在使用 ServiceNow 和 Angular.js 构建的网站上进行开发。页面似乎工作正常,直到我将 body 替换为自身后,所有 Buttons/onClicks 或搜索都停止响应..有人知
带有 [innerHtml] 指令的元素似乎只是在该元素内添加声明的 html 字符串,仅此而已; 通过 this stackblitz ,我试图在这样的元素中添加一些东西,但没有成功; new wo
为什么选址 http://xn--wiadomesny-37b.pl/test/抛出 Uncaught TypeError: Cannot set property 'innerHTML' of nu
我的 javascript 获取日期和时间并将其放置在 div 中如下: function print(message){ var div1= document.getElementById("d
在下面的代码中,我尝试以不将猫名称硬编码到 html 的方式设置猫名称。因此我使用的是数组。然而,每当我尝试将innerHTML属性设置为catNames [0]或catNames [1]时,我都会收
我正在使用 mootool 的 Request.JSON 从 Twitter 检索推文。收到它后,我将写入目标 div 的 .innerHTML 属性。当我在本地将其作为文件进行测试时,即 file:
这个问题在这里已经有了答案: How to get Angular2 to bind component in innerHTML (1 个回答) 关闭 6 年前。 所以我正在构建一个 angula
我有一个简短的脚本,它在 innerHTML 中查找具有特定文本的特定类,然后使用 replaceWith 替换整个元素。当只有一段特定的文本时,此方法非常有用,但我有几个项目要查找和替换。 下面的
我正在尝试使用 Wordpress/Woocommerce 上动态生成的 div 类更改“查看购物车”按钮的 innerHTML。我之前问过一个关于这个的问题,有人建议(谢谢 Mike :))因为 J
我是一名优秀的程序员,十分优秀!