javascript - 如何使用 jQuery 删除文本区域的禁用属性？

Question

我的 HTML 表单中有多个文本区域，每个文本区域后跟一个编辑链接。当我点击一个编辑链接，应启用相应的文本区域。我的代码如下:

<script type="text/javascript">

    $(document).ready(function() {

        $(".edit").click(function(){
            $(this).attr("id").removeAttr("disabled");
        });

    });  

</script>

<textarea  id="txt1"  disabled="true"></textarea>
<a class="edit" id="txt1" >edit</a>

<textarea  id="txt2"  disabled="true"></textarea>
<a class="edit" id="txt2" >edit</a>

为什么点击相应的链接后没有启用textarea？

Answer 1

id 在一个页面中只能使用一次。不能有 2 个(或更多)元素具有相同的 ID。

相反，do this :

<form id="myform">
    <!-- group each in divs -->
    <div>
        <textarea disabled="true"></textarea>
        <a class="edit">edit</a>
    </div>
    <div>
        <textarea disabled="true"></textarea>
        <a class="edit">edit</a>
    </div>
</form>
<script>
    $(function(){
        $('#myform').on('click','.edit',function(){ 
            $(this)                       //when edit is clicked
                .siblings('textarea')     //find it's pair textarea
                .prop("disabled", false)  //and enable
            return false;
        });
    });
</script>

如果你不能使用 div，那么你可以使用 prev('textarea') 而不是 siblings('textarea') 来获取前面的 textarea。