使用 JQuery 从 asp:textbox 中检索值答案

【问题标题】：Retrieve value from asp:textbox with JQuery使用 JQuery 从 asp:textbox 中检索值
【发布时间】：2009-10-23 09:49:30
【问题描述】：

我在网页上的表单中有几个 asp:textbox 控件，下面是一个 sn-p。第一个是输入收件人的字段，另一个是一个较大的文本区域，应在其中加载收件人姓名以及其他一些文本。

<asp:TextBox name="recipient" ID="recipient" class="inputBox" onChange="addNames()" runat="server" />
<asp:TextBox TextMode="MultiLine" name="usermessage" ID="usermessage" class="usermessage" height="128" width="425px" runat="server"></asp:TextBox>

使用带有此代码的 JQuery 将标准消息加载到第二个文本框中：

$(".usermessage").val("Hello etc");

效果很好，显示了消息。
当用户在其他文本框中输入收件人姓名或他自己的姓名时，会触发 addNames()。此函数将收件人姓名添加到用户消息框中的标准消息中。

function addNames() {
    //update textbox
    var recipient = $(".recipient").val();
    var sender = $(".name").val();
    $(".usermessage").val("Hello " + recipient +", \nThis is a message. \n\rKind regards, \n" + sender);
    }

问题是recipient和sender这两个变量是“未定义的”。

你好，未定义，
这是一条消息。

亲切的问候，
未定义

实际问题：从 asp:textbox 中检索值的正确代码是什么

var recipient = $(".recipient").val();

不工作？

html中的输出如下：

<input name="ctl00$contentPlaceHolderRightColumn$recipient" type="text" id="ctl00_contentPlaceHolderRightColumn_recipient" name="recipient" class="inputBox" onChange="addNames()" />

我正在使用 JQuery v1.3.2 和 Firefox v3.5.3。

【问题讨论】：

标签： c# asp.net jquery

【解决方案1】：

据我所知

var recipient = $(".recipient")

将选择所有具有接收者 CLASS 的 dom 元素。你的输入框有一个“inputBox”类。

您需要使用#按其ID进行选择

所以：

var recipient = $("#recipient")

但是您使用的是 ASP.NET 控件，它为它提供了在服务器上生成的唯一 ID，因此它是唯一的。（在您的情况下，它是 ctl00_contentPlaceHolderRightColumn_recipient）

要选择你需要做的事情

var recipient = $("#<%=recipient.ClientID%>")

-编辑了一些语法错误

【讨论】：

这让我走上了正轨。您的两个解决方案： var recipient = $("#").val(); AND var 收件人 = $(".recipient").val(); [将“收件人”类添加到文本框控件]，工作。 :) 谢谢！
啊。我需要自己阅读 jQuery 文档，我怎么会错过那个“。”在选择器中）-。好地方。

【解决方案2】：

如果您设置了 asp 文本框的 clientID，您应该能够在 JQuery 中以与您相同的方式使用它，但使用哈希而不是点。

例如

ClientID = "recipient"

then

    var recipient = $('#recipient').innerHTML() 

or

    var recipient = $('#recipient').text()

【讨论】：

遗憾的是，无济于事。我仍然得到“未定义”的输出。
当然：
您是否尝试过设置 ClientID 和 $('#recipient')，顺便说一句？这是一个编辑。如果这不起作用，恐怕我没有想法。
另外，使用 .innerHTML 而不是 .val 可能值得，因为我不确定文本框的值是否会更新。
是的，我做到了。 :) 这使我们两个人，因为没有想法的一部分。

【解决方案3】：

通过这个，您还可以获得 asp 按钮或任何相关的控件。

var txt_recipient = document.querySelector("input[id*='recipient']");
alert(txt_recipient.Value);

如果您在客户端有多个具有相同 ID 的控件，也可以尝试 querySelectorAll()。

jQuery 等式是

$("input[id*='recipient']").val()

【讨论】：

【解决方案4】：

我认为 jQuery 选择器会返回一个对象列表。你试过了吗：

var recipient = $(".recipient")[0].val();

更新

那么这个呢：

var 收件人 = $(".recipient:first").val();

它还有一个很好的优势 - 会在第一场比赛中刹车。

【讨论】：

这是一个天才的想法，但遗憾的是它不起作用。 FireBug 说：“$(".recipient")[0] 未定义”。
不，仍然没有运气:(虽然这是一个选择器问题，但很清楚。如果我输入 $('.bogus').val();，有或没有前面的点，我得到结果相同。“Hello undefined”。
您能否检查并粘贴您在浏览器中看到的生成的 HTML（来源）？检查名称属性是否未更改为通常的“ctrl00_”ASP.NET 方式。您使用的是什么 jQuery 版本和浏览器？有几次我遇到了 jQuery 1.2x 的问题（错误？），因为我无法使用控件 ID 作为选择器，不得不求助于这个“$('[id="control_id"]')”。如果 ASP.NET 更改了名称，请尝试 $('[name="recipient"]') 或 $('[name^="recipient"]')。
是的，生成的输出被更改为“ctl00”等。但是你的 $('[name="recipient"]') 没有改变任何东西......我迷路了。跨度>
好吧，您更改的控件名称仍应以“recipient”结尾，尝试 'name$="recipient"' 选择器。它选择所有具有以“recipient”结尾的“name”属性的控件。请参阅 docs.jquery.com/Selectors 了解所有可用的选择器。

【解决方案5】：

我猜 asp.net HTML 控件必须具有 ClientID="recipient" 属性才能在客户端使用客户端 ID 访问控件。或者我不知道！

<asp:TextBox ID="recipient" ClientID="recipient" runat="server" name="recipient" class="inputBox" onChange="addNames()" />

试试这个应该可以的。

【讨论】：

【解决方案6】：

在 ASP.NET 中，你需要这样写：

var recipient = $("#&lt;%=recipient.ClientID%&gt;").val();

在MVC中，那么你可以这样写：

var recipient = $("#recipient").val();

【讨论】：