附加文本到div元素使用jQuery

使用下面的代碼，當點擊我附上一些input元素融入#cls格。但是當我嘗試在輸入內輸入新的輸入時添加。當我點擊「點擊」文本時，我只需要新的輸入。誰能幫我。謝謝附加文本到div元素使用jQuery

$('#cls').click(function() { 
    var add="<input type="text">" 
    $(#cls).append(add); 
});

<div id="cls">click</div>

來源

2016-02-12 Buddhika Kulathilaka

鑑於代碼中的語法錯誤，我不明白它是如何工作的。 –

你想每次點擊'cls'時都要追加新的'input'嗎？ –

您需要查看點擊是否實際在div

$('#cls').click(function(e) { 
 
    if ($(e.target).is(this)) { //or !$(e.target).is('input') 
 
    var add = '<input type="text">'; 
 
    $(this).append(add); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="cls">click</div>

來源

2016-02-12 09:56:21

我不知道OP試圖達到什麼目的，但如果你繼續clickinng'click'，它會追加新的輸入。 –

@Arun'if（$（e.target）.is（$（this）））{'也可以。你能解釋爲什麼選擇'this'而不是'$（this）'。我猜是因爲如果包裝在jquery對象中，它更「昂貴」？ –

@jackblank是... –

發生附加您輸入父元素：

var clicked= false; 
 
$('#cls').click(function() { 
 
    if(!clicked){ 
 
    var add="<input type='text'>"; 
 
    $(this).parent().append(add); 
 
    clicked = true; 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id='cls'>click</div>

來源

2016-02-12 09:57:46

如果你的用戶。經過（）方法，而不是.append（）文本框會出現在#cls格之外，因此點擊文本框不會導致增加一個新的。

一些代碼

$('#cls').click(function() { 
    var add="<input type='text'>"; 
    $('#cls').after(add); 
});

Try it out

來源

2016-02-12 09:59:21 Pekka

使用jQuery的一個方法。它只會註冊點擊處理程序一次。

$('#cls').one("click", function(e) { 
    var add = '<input type="text">'; 
    $(this).append(add); 
});

來源

2016-02-12 10:11:06

附加文本到div元素使用jQuery

回答

相關問題