使用 JavaScript/jquery 刷新文本字段中的值
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/11826770/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Refresh value in text field with JavaScript/jquery
提问by Dom
I have a function that calculate price for a product. I'm not JavaScript developer so my knowledge is very limited.
我有一个计算产品价格的函数。我不是 JavaScript 开发人员，所以我的知识非常有限。
By changing the value in the text field script calculate price for product.
通过更改文本字段脚本中的值来计算产品的价格。
<input type="text" value="" name="options[22]" class="input-text"
onfocus="opConfig.reloadPrice()">
Problem is that the script triggers only if the following is done:
问题是脚本只有在完成以下操作后才会触发：
- insert value into the textfield
- click somewhere outside the textfield
- click back into the text field
- 将值插入文本字段
- 单击文本字段之外的某处
- 单击返回文本字段
All I need is a button saying refresh that by clicking it will have functionality of step 2 and step above.
我所需要的只是一个按钮，上面写着刷新，通过单击它将具有第 2 步和上述第 2 步的功能。
I'm not sure if I explained it properly so if there is any more information required to resolve this issue please let me know.
我不确定我是否正确解释了它，所以如果需要更多信息来解决这个问题，请告诉我。
Here is the link to the site.
这是该网站的链接。
http://www.floorstodoors.mldemo.co.uk/spotlight/oak-value-lacquered-3-strip.html
http://www.floorstodoors.mldemo.co.uk/spotlight/oak-value-lacquered-3-strip.html
The field im trying to amend/add refresh button is Enter Square Metre
我试图修改/添加刷新按钮的字段是输入平方米
采纳答案by Christofer Eliasson
I'm not sure I fully understand you, but is this what you need?
我不确定我是否完全理解你，但这是你需要的吗？
<input type="text" value="" name="options[22]" class="input-text">
<input type="button" onclick="opConfig.reloadPrice()" value="Refresh" />
A button with an click-event listener, so that when you click the refresh-button the opConfig.reloadPrice()method gets executed.
带有单击事件侦听器的按钮，以便在单击刷新按钮opConfig.reloadPrice()时执行该方法。
Edit based on comment:
根据评论编辑：
I'm not sure what JavaScript library you are using, but you have these two lines in you code that seems to add event-listeners to the input with id qty.
我不确定您使用的是什么 JavaScript 库，但是您的代码中有这两行似乎将事件侦听器添加到带有 id 的输入中qty。
$('qty').observe('focus',function(){
$('qty').setValue($('qty').getValue().replace(/[^0-9]/g,''));
});
$('qty').observe('focus',this.getFromQties.bind(this))
They are listening for the focusevent, thus only triggers when your input field gains focus.
它们正在侦听focus事件，因此仅在您的输入字段获得焦点时触发。
If you modify those to listen for the keyup event instead, I believe it will work better. Without being familiar with the framework, I guess the only thing to change would be this:
如果你修改它们来监听 keyup 事件，我相信它会更好地工作。在不熟悉框架的情况下，我想唯一要改变的是：
$('qty').observe('keyup',function(){
$('qty').setValue($('qty').getValue().replace(/[^0-9]/g,''));
});
$('qty').observe('keyup',this.getFromQties.bind(this))
回答by Paul Aldred-Bann
You'd add your event to a button, and retrieve a reference to your input by assigning an ID:
您可以将事件添加到按钮，并通过分配 ID 检索对输入的引用：
<input type="text" value="" name="options[22]" id="price" class="input-text" />
<input type="button" value="Refresh" onclick="reloadPrice();" />
function reloadPrice() {
var price = "0.00"; // set your price here
// get a ref to your element and assign value
var elem = document.getElementById("price");
elem.value = price;
}
回答by Armel Larcier
Use onchange or onblur instead of onfocus!
使用 onchange 或 onblur 代替 onfocus！
回答by SReject
use onchange. This will activate anytime the value changes:
使用 onchange。这将在值更改时激活：
<input type="text" value="" name="options[22]" class="input-text" onchange="opConfig.reloadPrice()">
回答by tuxtimo
First: this is JavaScript and not Java - so you have to be a javascript and not a java developer.
首先：这是 JavaScript 而不是 Java - 所以你必须是一个 JavaScript 而不是 Java 开发人员。
to solve your problem you can make a new button with a onclick attribute and execute your function there which you have in your onfocus attribute in the text-field. or you can take another event - like onchange or onblur for instance..
要解决您的问题，您可以创建一个带有 onclick 属性的新按钮，然后在文本字段的 onfocus 属性中执行您的功能。或者您可以参加另一个活动 - 例如 onchange 或 onblur ..
<input type="text" onchange="..yourfunctionhere...">
回答by subodh
All I need is a button saying refresh that by clicking it will have functionality
For that you need a button with onclick listener, do the below things.
为此，您需要一个带有 onclick 侦听器的按钮，请执行以下操作。
<input type="button" value="Refresh" onclick="opConfig.reloadPrice();" />
<input type="text" value="" name="options[22]" class="input-text"/>
