【问题标题】:Displaying Texbox value using Jquery使用 Jquery 显示文本框值
【发布时间】:2012-03-17 23:36:39
【问题描述】:

我有一个带有文本框的 Asp.Net Webform。我正在尝试在按钮单击时嵌入一些文本的文本区域中显示文本框服务器控件值的值。我不确定它是在服务器问题还是回发问题时运行的服务器控件,文本框的值未填充在文本区域中。任何帮助将不胜感激。提前致谢。

 <html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <script src="jquery.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $('#Button2').click(function () {
                $('#test').show();
                return false;
            });
        });

    </script>
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
        <asp:Button ID="Button2" runat="server" Text="Go" />



        <span id="test" style="display: none">
            <textarea id="showTextarea">
    This is new <%=TextBox1.Text %> from web form server control.
    </textarea>
        </span>
    </div>
    </form>
</body>
</html>

【问题讨论】:

    标签: jquery asp.net webforms


    【解决方案1】:

    使用 jQuery,

       $(function() {
            $('#Button2').click(function () {
                $('#showTextarea').val($("#TextBox1").val());
                return false;
            });
        });
    

    如果您的 TextBox 具有 ID TextBox1 并且您的文本区域 具有 ID showTextarea 并且您的按钮 具有 ID Button2,则此代码将起作用

    在 ASP.NET 网络表单中,如果您的控件位于其他 ASP.NET 控件(如面板等)中,则 id 不会完全像这样。您可能需要检查 ViewSource 来验证这一点。

    【讨论】:

      【解决方案2】:

      这不是回发问题。 jQuery/javascript 处理点击,当它返回 false 时意味着不回发。

      客户端

      如果您想显示文本框中的值而不在服务器上对其进行任何操作,那么您应该只检索答案并返回 false(或者您可以将事件添加到函数 function(e) { 然后执行 @ 987654322@)

        $("#Button2").click(function () {
          $("#showTextarea").val("This is new " + $("#TextBox1").val() + " from web form server control");
          $("#test").show();
          return false;
        });
      

      服务器端

      如果您想在服务器端处理数据,您应该在 aspx 页面中添加一个多行文本框,并将其默认设置为 Visible="False"

      <asp:TextBox ID="showTextarea" runat="server" TextMode="MultiLine" Visible="False"></asp:TextBox>
      

      然后后面的代码如下:

      protected void Button2_Click(object sender, EventArgs e)
      {
          showTextarea.Visible = true;
          showTextarea.Text = "This is new " + TextBox1.Text + " from web form server control.";
      }
      

      【讨论】:

      • 我正在尝试使用 jquery 显示如下 sn-p 代码。有什么建议么?
      • 如果你不想用 jQuery 显示它,那么你不能使用 ´´ 从表单中检索值,你必须使用 ´$("#idOfElement" 从文本框中获取数据).val()'。请参阅上面的答案,您如何将静态文本和文本框中的动态文本结合在一起。如果您认为原始问题已得到解答,那么您应该“接受”最佳答案。
      【解决方案3】:
          <script type="text/javascript">
          $(document).ready(function () {
              $('#Button2').click(function () {
                  $('#showTextarea').val('This is new' + $('#TextBox1').val() + ' from web form server control');
                  $('#test').show();
                  return false;
              });
          });
      
      </script>
      
      <textarea id="showTextarea">
      
      </textarea>
      

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 2020-10-02
        • 2011-01-19
        • 2013-12-15
        • 2023-03-24
        • 1970-01-01
        • 2019-08-08
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多