Question

我的网站包含一堆设置为“只读”的<input type="text">个标记。单击时，我删除readonly属性。在同一次点击中，我还想显示一个带有“saveLink”类的图像。

点击事件的第一部分有用......它会删除<input type="text">的只读属性。但是第二部分不起作用，它找不到具有“saveLink”类的元素。

这是我的jQuery：

$("body").on('click', '.pageLinks input[type=text]', function () {
    $(this).prop('readonly', false);
    $(this).find('[class=saveLink]').css('display', 'block');
});

这是我的HTML：

<div class="pageLinks">
    <div>
        <div>
            <input type="text" readonly="readonly">
        </div>
        <div>
            <img src='/saveLink.png' class='saveLink' style='display: none;' />
        </div>
    </div>

    <div>
        <div>
            <input type="text" readonly="readonly">
        </div>
        <div>
            <img src='/saveLink.png' class='saveLink' style='display: none;' />
        </div>
    </div>

    <div>
        <div>
            <input type="text" readonly="readonly">
        </div>
        <div>
            <img src='/saveLink.png' class='saveLink' style='display: none;' />
        </div>
    </div>
</div>

我能做些什么来解决这个问题吗？感谢

Answer 1

尝试

Jsfiddle Demo

$(this).parent().next().find('.saveLink').show();

或

Jsfiddle Demo

$(this).closest('.pageLinks').find('.saveLink').show();

<小时/> 参考

.closest()

Answer 2

变化：

$(this).find('[class=saveLink]').css('display', 'block');

为：

$(this).parent().next().find('img.saveLink').css('display', 'block');

<强> jsFiddle example

Answer 3

找到是，但$（＆＃39; .className＆＃39;）

$("body").on('click', '.pageLinks input[type=text]', function () {
$(this).prop('readonly', false);
$(this).find('.saveLink').css('display', 'block');

Answer 4

为什么不呢：

$('.saveLink').css('display', 'block');

使用jQuery查找基于类的元素

4 个答案: