2009-04-22 36 views
18

"đây" là trường văn bản, "new_id" là một số nguyên.Đặt id mới với jQuery

Khi tôi áp dụng đoạn mã sau:

$(this).attr('id', this.id + '_' + new_id); 
$(this).attr('name', this.name + '_' + new_id); 
$(this).attr('value', 'test'); 

những thay đổi id, tên thay đổi quá, nhưng không phải là giá trị. Nếu tôi thay đổi dòng cuối cùng thành dòng này (và do đó sử dụng một chuỗi chữ)

$('#mytextfield_3').attr('value', 'test'); 

nó hoạt động.

Bất kỳ ý tưởng nào?

- EDIT - Nhờ Steerpike cho thử nghiệm plugin nhanh - tôi tin rằng nó sẽ hoạt động, nhưng tôi không thể tìm thấy lỗi.

Dưới đây là một số mã khác:

tôi tạo clone sử dụng

clone = $(this).find('.clone_fields_container:first').clone(); 

"clone" bây giờ chứa một div mà đã nhúng lĩnh vực đầu vào.

Sau khi tạo id mới:

/** Iterate over input and select fields in container */ 

    clone.children('input,select,textarea').each(function() { 
    $(this).attr('id', this.id + '_' + new_id); 
    $(this).attr('name', this.name + '_' + new_id); 
    $(this).val('test'); 
    console.log(this); 
    }); 

Các lĩnh vực văn bản không có bất kỳ giá trị.

+0

là id duy nhất cho tài liệu sau khi bạn đã thay đổi nó? – fredrik

+0

vâng, sau khi tôi thay đổi nó, nó độc đáo – schneck

Trả lời

22

tôi chỉ viết một plugin nhanh chóng để chạy thử nghiệm sử dụng đoạn mã tương tự của bạn và nó hoạt động tốt

$.fn.test = function() { 
     return this.each(function(){ 
     var new_id = 5; 
     $(this).attr('id', this.id + '_' + new_id); 
     $(this).attr('name', this.name + '_' + new_id); 
     $(this).attr('value', 'test'); 
     }); 
    }; 

$(document).ready(function() { 
    $('#field_id').test() 
}); 

<body> 
    <div id="container"> 

    <input type="text" name="field_name" id="field_id" value="meh" /> 
    </div> 
</body> 

Vì vậy, tôi chỉ có thể đoán được điều gì khác đang diễn ra trong mã của bạn. Bạn có thể cung cấp thêm một số chi tiết không?

+1

Bạn đã đúng, sau nửa đêm gỡ lỗi tôi thấy rằng không tốt để trộn .html() chỉnh sửa với thao tác nút trực tiếp ... dù sao, mã của bạn đưa tôi đến giải pháp, cảm ơn rất nhiều. – schneck

0

EDIT: dựa trên nhận xét của bạn và giả định rằng this là phần tử được nhân bản.

$(this).clone() 
     .attr('id', this.id + '_' + new_id) 
     .attr('name', this.name + '_' + new_id) 
     .val('test') 
     .appendTo('#someElement'); 

Full Ví dụ

<script type="text/javascript"> 
    var new_id = 0; 
    $(document).ready(function() { 
     $('#container > input[type=button]').click(function() { 
      var oldinp = $('input#inp')[0]; 
      var newinp = $(oldinp).clone() 
            .attr('id',oldinp.id + new_id) 
            .attr('name',oldinp.name + new_id) 
            .val('test') 
            .appendTo($('#container')); 
      $('#container').append('<br>'); 
      new_id++; 
     }); 
    }); 
</script> 


<div id="container"> 
<input type="button" value="Clone" /><br/> 
<input id="inp" name="inp" type="text" value="hmmm" /><br/> 
</div> 
+0

Thật không may, điều đó cũng không hoạt động. – schneck

+0

@TStamper: vâng, tôi hiểu, nhưng điều này không hiệu quả. @tvanfosson: Thay đổi giá trị trước khi id không hoạt động ở đây, bởi vì phần tử biểu mẫu là bản sao của một phần tử khác, vì vậy trước tiên nó phải có một id duy nhất. – schneck

+0

@schneck - Tôi đã cập nhật câu trả lời của mình liên quan đến nhân bản một phần tử. – tvanfosson

1

Bạn hãy thử

$(this).val('test'); 

thay vì

$(this).attr('value', 'test'); 

val() nói chung là dễ dàng hơn, vì thuộc tính bạn cần thay đổi có thể khác nhau trên các phần tử DOM khác nhau.

0

gì xảy ra khi bạn thiết lập tất cả các thuộc tính trong một attr() command như vậy

$(this).attr({ 
       id : this.id + '_' + new_id, 
       name: this.name + '_' + new_id, 
       value: 'test' 
      }); 
0

Sử dụng .val() không attr('value').

Các vấn đề liên quan