Question

我面临一个奇怪的问题，并且不确定是jquery还是我的场景的组合导致了这个问题。当我使用jquery设置文本框值时，文本框显示正确的值，但html中的value属性仍然是它加载的值。为什么它显示的是与DOM中的文本不同的文本？

我有一个动态生成的表单，它添加两个数字并使用jquery在第三个文本框中显示添加，如下所示。您可以使用以下代码重现

设计师档案

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">

<script src="../Scripts/jquery-1.4.1.js" type="text/javascript"></script>
<script type="text/javascript">
    $(document).ready(function () {

        $(".addToTotal").blur(function () {
            UpdateTotal();
        });
    });

    function UpdateTotal() {

        var add = 0;
        $(".addToTotal").each(function () {
            add += Number($(this).val());
        });
        $(".txtTotalPoints").val(add.toFixed(2));
        $("#para").text("Sum of all textboxes is : " + add);
    }

</script>
<asp:PlaceHolder ID="PlaceHolder1" runat="server"></asp:PlaceHolder>
<input id="addAll" type="button" value="Sum all Textboxes" /><br />
<p id="para"> </p>
<br />
<asp:Button ID="Button1" runat="server" Text="Button" onclick="Button1_Click" />

动态添加控件的代码隐藏文件是

        protected void Page_Init(object sender, EventArgs e)
    {
        TextBox txt1 = new TextBox();
        txt1.ID = "txt1";
        txt1.CssClass = "addToTotal";

        TextBox txt2 = new TextBox();
        txt2.ID = "txt2";
        txt2.CssClass = "addToTotal";

        TextBox txt3 = new TextBox();
        txt3.ID = "txt3";
        txt3.CssClass = "txtTotalPoints";

        PlaceHolder1.Controls.Add(txt1);
        PlaceHolder1.Controls.Add(txt2);
        PlaceHolder1.Controls.Add(txt3);
    }

    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            UpdateTextBoxTextProperty(this);
        }
    }

    private void UpdateTextBoxTextProperty(Control parent)
    {
        foreach (Control c in parent.Controls)
        {
            if (c is TextBox)
            {
                string Id = c.ID;
                string fieldName = Id.Substring(3);
                (c as TextBox).Text = fieldName;
            }

            if (c.Controls.Count > 0)
            {
                UpdateTextBoxTextProperty(c);
            }
        }
    }

    protected void Button1_Click(object sender, EventArgs e)
    {

    }

Answer 1

你也可以用户

$(selector).attr("value","Hello World.");

Answer 2

应该发生什么：dom是动态的，但是当您查看页面源时，浏览器将显示原始的html。（当然，这取决于您使用的浏览器，每个浏览器都不同）

文本框上的jquery val（）不设置DOM值属性

2 个答案: