如何使用jQuery删除textarea的禁用属性？

Question

我的HTML表单中有多个textareas,后面跟着每个的编辑链接.单击编辑链接时,应启用相应的文本区域.我的代码如下:

<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

ids只能在页面中使用一次.你不能拥有2个具有相同身份的元素(或更多).

相反,这样做:

<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.