為什么append（）無法與輸入標簽一起使用？

Question

我想在“提交”按鈕的值后附加<i>Some Text</i> 。 如果我像代碼片段中那樣用HTML編寫代碼，則可以使用，但是如果我使用jQuery附加代碼，則可以部分使用。

我的意思是說，如果您打開Developer Tools，則會顯示附加的文本，但不會顯示在瀏覽器屏幕上。

為什么會這樣？

 $(document).ready(function(){ $('.tryout').append('<i>Hello</i>'); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <input class="tryout" type="submit"></input> <hr> <input type="submit"><i>Hello</i></input> 

Answer 1

您不能將任何內容附加到輸入元素，而是使用按鈕

 $(document).ready(function() { $('.tryout').append('<i>Hello</i>'); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <button class="tryout" type="submit"></button> <hr> <button type="submit"><i>Hello</i></button> 

---

或者，如果您願意，可以使用.after（）像$('.tryout').after('<i>Hello</i>');一樣，將新元素作為按鈕的同級元素插入$('.tryout').after('<i>Hello</i>');

Answer 2

您需要使用.after而不是.append()在某些元素之后追加元素：

在匹配的元素集中的每個元素之后插入由參數指定的內容。

 $('.tryout').after('<i>Hello</i>');