我有多个 div 及其 id,onclick 我将 div 的 id 存储在一个输入值中,但它只需要一个 id,我想有多个选择并将所有选定的 div id 存储在同一个输入中,这是我的代码:
function storeId (el) {
$('input').val(el.id);
}
div{
background-color:red;
height: 50px;
width: 50px;
margin-bottom: 15px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="div-1" onclick="storeId(this);">
</div>
<div id="div-2" onclick="storeId(this);">
</div>
<div id="div-3" onclick="storeId(this);">
</div>
<div id="div-4" onclick="storeId(this);">
</div>
<input>
最佳答案
不是直接设置输入的值,而是将 id
存储在一个数组中,然后在每次点击时,用数组的内容更新输入。
此外,不要使用内联 HTML 事件属性。有 many reasons 不要使用这种不会死的古老技术。
let ids = [];
$("div").on("click", function(){
// If the id is not already in the array, add it. If it is, remove it
ids.indexOf(this.id) === -1 ? ids.push(this.id) : ids.splice(ids.indexOf(this.id),1);
$('input').val(ids.join(", ")); // populate the input with the array items separated with a comma
});
div{
background-color:red;
height: 50px;
width:50px;
margin-bottom: 15px;
display:inline-block; /* Just for the SO space */
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="div-1"></div>
<div id="div-2"></div>
<div id="div-3"></div>
<div id="div-4"></div>
<input>
关于javascript - 多div选择onclick,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50825559/