我有两个输入字段,我想把值存储到一个字符串中。问题是我不确定如何在第一个输入中存储变量。例如,如果用户仅输入p1的值,则它应该是“Partner IN(“+ document.getElementById(“p1”).value +”)”,但是如果用户输入p1和p2的值,则它应该是Partner IN(“+ document.getElementById(“p1”).value +”,“+ document.getElementById(“p2”).value +”)”。我想确保变量ep具有更新的值(即如果用户决定多次更改值)
https://jsfiddle.net/Charan98/ynbh142x/
let ep;
document.getElementById("p1").addEventListener("blur", () => {
document.getElementById("p2").addEventListener("blur", () => {
if (document.getElementById("p2").value.length == 0) {
ep = "Partner IN (" + document.getElementById("p1").value + ")";
} else {
ep = "Partner IN (" + document.getElementById("p1").value + "," + document.getElementById("p2").value + ")";
}
});
ep = "Partner IN (" + document.getElementById("p1").value + ")";
console.log(ep)
});
<div>
<input id="p1" type="text" value="" />
<br>
<br>
<input id="p2" type="text" value="" />
</div>
4条答案
按热度按时间cqoc49vn1#
我会监听这两个函数并创建一个getContent函数,它负责创建格式化的内容
这里有一个例子在这个小提琴:https://jsfiddle.net/o1cwb6th/
yyyllmsg2#
这是一个很好的例子,说明数组和它们的方法可以很好地工作。将这些值分别提交到数组中,然后将它们连接到一个逗号分隔的字符串中。
bihw5rsg3#
编辑:我不知道答案被标记为已解决,对不起...不管怎样...
我看到你的评论:
代码如果我有p1和p2都有值,但我最终改变了p1的值,我没有得到p1和p2的更新值
所以有一个想法来避免这种情况,但我使用
keyup
事件。ylamdve64#
我假设您希望仅在
#p1
收到blur
事件后才激活#p2
的侦听器。但是您当前的代码是每当#p1
接收到blur
事件时向#p2
添加一个新的侦听器。相反,您可以始终连接侦听器,但在
#p1
不包含值的情况下提前返回:也可以将同一个侦听器附加到这两个元素。然后,侦听器可以评估动态添加什么值和多少值。(参见mykaf's answer。)
如果你不想两次添加相同的监听器,你也可以使用事件委托:将相同侦听器添加到公共祖先。
注意:由于
blur
不会冒泡,所以只能求助于类似的focusout
event。