Question

我似乎无法让replaceWith与子类一起工作。我应该采取另一种方式吗？

<ul>
<li><input type="text" class="fn" value="Elvis"> <a href="#" class=".rmv" onclick="test()">test</a></li>

<li><input type="text" class="fn" value="Sam"> <a href="#" class=".rmv" onclick="test()">test</a></li>
</ul>

<script>
function test() {
$(this).find('.fn').val().replaceWith('Ted')
}
</script>

Answer 1

jQuery .val（）只能用于获取INPUT标记的值。

要设置该值，您必须使用'.val（newvalue）'，在您的情况下：

$(this).find('.fn').val('Ted');

编辑：您现在可能已经解决了这个问题，但为了完整起见，还有一些更改可以使jsfiddle脚本正常工作。

您需要将javascript的加载类型设置为“无换行”，以便全局找到test。

然后，在链接上使用onclick，您还需要将被调用者对象test(this)传递给回调，如下所示：

<li><input type="text" class="fn" value="Elvis"> <a href="#" class=".rmv" onclick="test(this)">
test</a></li>

最后，为了引用<input>标记并更改其值，一种方法是查找<li>标记，然后向下查找<input class="fn"> jQuery像这样：

function test(e) {    
   $(e).parents('li').find('.fn').val('Ted');
}

通过这些更改，点击相应<input>元素的<li>中所附的<a>值会更改为Ted。

Answer 2

就像旁注一样 - 你在锚标签上使用了错误的类 - 它应该是

<a href="#" class="rmv">

而不是

<a href="#" class=".rmv">

由于你已经在使用jQuery，你可以使用jQuery附加click()事件，如下所示：

＆＃13;

$(document).ready(function () {
    $(".rmv").click(function (e) {
        e.preventDefault();
        $(this).prev('.fn').val('Ted');
    });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<ul>
    <li>
        <input type="text" class="fn" value="Elvis" /> <a href="#" class="rmv">test</a>

    </li>
    <li>
        <input type="text" class="fn" value="Sam" /> <a href="#" class="rmv">test</a>

    </li>
</ul>

＆＃13;

replaceWith不适用于子类

2 个答案: