jQuery

Question

在jQuery中，如何将HTML行附加到某些HTML，以及删除HTML行？

这是之前的代码：

<div class="form-group">
    <label class="control-label col-md-2" for="txtCvc">Cvc</label>
    <div class="col-md-10">
        <input class="form-control text-box single-line" id="txtCvc" name="Cvc" type="text" value="" />
    </div>
</div>

这是后续代码：

<div class="form-group">
    <label class="control-label col-md-2" for="txtCvc">Cvc</label>
    <div class="col-md-10">
        <input class="form-control text-box single-line" id="txtCvc" name="Cvc" type="text" value="" />
        <span class="field-validation-error" data-valmsg-for="txtCvc" data-valmsg-replace="true">Test message.</span>
    </div>
</div>

我需要添加这行代码：

<span class="field-validation-error" data-valmsg-for="txtCvc" data-valmsg-replace="true">Test message.</span>

还有，反过来。我怎样才能删除这行代码？

这是之前的代码：

<div class="form-group">
    <label class="control-label col-md-2" for="txtCvc">Cvc</label>
    <div class="col-md-10">
        <input class="form-control text-box single-line" id="txtCvc" name="Cvc" type="text" value="" />
        <span class="field-validation-error" data-valmsg-for="txtCvc" data-valmsg-replace="true">Test message.</span>
    </div>
</div>

这是后续代码：

<div class="form-group">
    <label class="control-label col-md-2" for="txtCvc">Cvc</label>
    <div class="col-md-10">
        <input class="form-control text-box single-line" id="txtCvc" name="Cvc" type="text" value="" />
    </div>
</div>

对不起，我忘了说我是初学者jQuery。我现在正在查看附加和删除功能。提前致谢。

Answer 1

只需使用 .append() and .remove() 方法。

Answer 2

对于像

这样的错误信息，如果使用show()和hide()会更合适

$('.field-validation-error').show();

用于显示消息和

$('.field-validation-error').hide();

为了隐藏它，使用 if else 来检查你的情况。

Answer 3

假设您知道要show/hide验证消息的输入字段元素，您可以使用after方法添加消息：

$field.after('<span class="field-validation-error" data-valmsg-for="txtCvc" data-valmsg-replace="true">Test message.</span>');

和remove删除它：

$field.next('.field-validation-error').remove();

所以 $field 可以是这样的：

var $field = $('#txtCvc');

jQuery - 添加和删除 HTML 代码

jQuery - Append and Remove HTML code

javascript

html

append

removechild