javascript - 使用 jQuery 在输入元素后添加 HTML

Question

我正在尝试使用 jQuery 在 input 字段后添加一些 HTML，但它不起作用，我不明白为什么。

<input type="text" value="secret password" maxlength="255" id="ripo" title="Password" class="ms-long ms-spellcheck-true">

$(document).ready(function() {
  jQuery("input[title='Password']").append('<P>test</P>');
});

Answer 1

append() 用于在元素内添加内容，但是表单输入不包含任何内容。通常您会使用 val() 来设置它们的值。

但是，要实现您的要求，请使用 after() 方法，而不是在所选元素之后将内容插入到 DOM 中:

$(function() {
  $("#ripo").after('<P>test</P>');
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" value="secret password" maxlength="255" id="ripo" title="Password" class="ms-long ms-spellcheck-true">