Question

我有一个转发器，里面是一个包含数据库中数据的文本框。当然，在运行时它会产生大量的数据，意味着很多文本框。

<asp:Repeater ID="rpter" runat="server">
  <ItemTemplate>
    <fieldset>
      <legend>
        <asp:Label ID="lblLegend" runat="server" Text='<%#DataBinder.Eval(Container,"DataItem.Name")%>' Font-Bold="true" />
      </legend>
      <div style="border: single, 1px;">
        <div>
          <asp:TextBox ID="txtMessage" runat="server" Text='<%#DataBinder.Eval(Container,"DataItem.Message")%>' Width="100%" TextMode="MultiLine"></asp:TextBox>
        </div>
       <div>
         <asp:Button ID="btnCopy" runat="server" Text="Copy" CommandName="Copy" OnClientClick="copyClipboard()" />
         </div>
      </div>
    </fieldset>
  </ItemTemplate>
</asp:Repeater>

我想要的是在单击按钮时从复制按钮旁边的文本框中选择文本，以便我可以将它复制到剪贴板上。

function copyClipboard() {
    CopiedTxt = document.selection.createRange();
    CopiedTxt.execCommand("Copy");
}

Answer 1

您需要将this传递给您的函数copyClipboard。所以你的按钮代码看起来像这样

<asp:Button ID="btnCopy" runat="server" Text="Copy" OnClientClick="copyClipboard(this)"/>

和div包装文本框的类，

<div class="texdiv">
  <asp:TextBox ID="txtMessage" runat="server" Text='<%#DataBinder.Eval(Container,"DataItem.Message")%>' Width="100%" TextMode="MultiLine"></asp:TextBox>
</div>

并且您的js功能将是

function copyClipboard(th) {
            alert($(th).parents().prevAll('.texdiv').find('*[id^=rpter_txtMessage]').val());
        }

在客户端点击按钮，您需要找到它之前的文本框，然后您才能获得它的价值它会给你相应的textbox值

Answer 2

$(function () {
    $(".copybtn").click (function (e) {
        Var txtMsgVal = $(this).parent().parent().find(".txtMsg").text();
        // Do something with the txtMsgVal here
        alert(txtMsgVal);
    });
});

您只需要按钮和输入（消息）上的类属性。

注意：我在这个答案中使用了jQuery，所以你必须在源代码中包含jQuery库。

祝你好运;）

Answer 3

我必须编辑您的ASP代码并将 CssClass =＆＃34; txtMessage＆＃34; 添加到 TextBox 。
另外 CssClass =＆＃34; btnCopy＆＃34; 到按钮
并删除了 OnClientClick =＆＃34; copyClipboard（）＆＃34; ，因为我们将在jQuery中处理它，如下所示：

ASP： -

<asp:Repeater ID="rpter" runat="server">
    <ItemTemplate>
    <fieldset>
        <legend>
        <asp:Label ID="lblLegend" runat="server" Text='<%#DataBinder.Eval(Container,"DataItem.Name")%>' Font-Bold="true" />
        </legend>
        <div style="border: single, 1px;">
            <div>
                <asp:TextBox ID="txtMessage" runat="server" CssClass="txtMessage" Text='<%#DataBinder.Eval(Container,"DataItem.Message")%>' Width="100%" TextMode="MultiLine"></asp:TextBox>
            </div>
            <div>
                <asp:Button ID="btnCopy" runat="server" CssClass="btnCopy" Text="Copy" CommandName="Copy" />
            </div>
        </div>
    </fieldset>
    </ItemTemplate>
</asp:Repeater>

不要忘记包含jQuery库：

<script type="text/javascript" src="jquery-1.10.2.min.js"></script>

jQuery将处理所有类别为 btnCopy 的项目的所有点击，并在父级的父级中查找 .txtMessage 项的按钮
并选择 TextBox 中的文字返回false，这样你的点击就不会带你去任何地方...

jQuery的： -

$(function () {
    $(".btnCopy").click(function (e) {
        $(this).parent().parent().find(".txtMessage").select();
        return false;
    });
});

我希望这对你有用，这是截图：
http://i59.tinypic.com/5ujvc9.jpg
http://i62.tinypic.com/35d4y7l.jpg

祝你好运;）

如何使用Jquery从转发器内的文本框中选择文本？

3 个答案: