如何使用Jquery從中繼器中的文本框中選擇文本？

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

我不得不編輯你的ASP代碼，並添加的CssClass = 「txtMessage」到文本框。
也的CssClass = 「btnCopy」到按鈕
並刪除了的OnClientClick = 「copyClipboard（）」，因爲我們要處理的是在我們的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項目父按鈕
的父內，並選擇文本框內的文本
並返回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

祝你好運;）

Answer 2

你需要傳遞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 value

Answer 3

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

您只需要按鈕和輸入（消息）上的類屬性。

注：我在這個答案中使用jQuery，所以你必須在你的源代碼中包含jQuery庫。

祝你好運;）