jQuery的，不会改变的价值，但会改变其他属性

Question

function send_mail(token, loader) { 
$(".send_mail").bind("click", function() { 
    try{ 
    var to = $(this).attr('ref'); 
    var mail_form = $("#mail_form"); 
    mail_form.find("li:eq(0) input").val("sdsds"); 
    //mail_form.find("li:eq(0) input").attr("ref", "sdsds"); 
    //mail_form.find("li:eq(0) input").attr("value", "sdsds"); 
    $.fancybox(mail_form.html(), { 'autoDimensions' : false, 'width' : 360, 'height' : 200, 'transitionIn' : 'none', 'transitionOut' : 'none', 'scrolling' : 'no', 'showCloseButton' : false }); 
    return false; 
    }catch(err){alert(err);} 
}); 
} 

我的问题是，上面还不会工作，如果我用

//mail_form.find("li:eq(0) input").attr("ref", "sdsds"); 

它会改变裁判，甚至

//mail_form.find("li:eq(0) input").attr("value", "sdsds"); 

将无法正常工作...

任何想法这是怎么回事？

Answer 1

当分别使用val()和attr设置value属性时，jQuery使用elem.value = ...和elem['value'] = ...。当涉及到value属性时，这些方法不会更改实际的HTML。因此，当您创建mail_form.html()中的fancybox时，您将获得原始value属性值，因为它们仍存在于HTML中。

但是，setAttribute()的确改变了底层的HTML value属性。尝试在将值更改为sdsds并在致电$.fancybox(...)之前添加此项：

mail_form.find("li:eq(0) input").each(function() { 
    this.setAttribute("value",$(this).val()); 
});