为什么 jquery 不获取输入值？答案

【问题标题】：Why doesn't jquery get input value?为什么 jquery 不获取输入值？
【发布时间】：2017-09-11 13:17:29
【问题描述】：

我使用了一个 asp.net 中继器来重复图像。

我想在通过 jquery 单击图像时获取从数据库返回的主键 ID，但它显示未定义。我将图像存储在输入文本字段中，它会显示在其中，但不会显示在警报中。

jQuery:

function displayStory() {
    var txtIDValue = $(this).find('input[id$=txtID]').val();
    var id = txtIDValue;
    alert(id);
}

中继器：

<asp:Repeater ID="rptrImages" runat="server">
    <ItemTemplate>    
        <div class="col-md-4">
            <div class="thumbnail">
                <input type="text" id="txtID" value='<%#Eval("ID")%>' />
                <asp:ImageButton ID="imgButtonStory" OnClientClick='displayStory();return false;' runat="server" ImageUrl='<%# "UploadedImages/"+ Eval("Image") %>' 
                 CssClass="img-responsive img-rounded" />
            </div>    
        </div>
    </ItemTemplate>
</asp:Repeater>

【问题讨论】：

find('input[id$=txtID]') =>find('input[id=txtID]') 有帮助吗？

标签： javascript jquery asp.net c#-4.0 repeater

【解决方案1】：

this 不是指调用点击事件处理程序的元素，它指的是window 对象。您可以使用.call() 设置上下文

<asp:ImageButton ID="imgButtonStory" OnClientClick='displayStory.call(this);return false;' runat="server" ImageUrl='<%# "UploadedImages/"+ Eval("Image") %>' 
                         CssClass="img-responsive img-rounded" />

在脚本中，您需要使用.prev()，因为文本框不是ImageButton的子元素

var txtIDValue= $(this).prev('input[id$=txtID]').val();
//var txtIDValue= $(this).closest('div').find('input[id$=txtID]').val();

【讨论】：

你是个传奇。谢谢

【解决方案2】：

你可以简单地说：

function displayStory() {
    var txtIDValue = $('input[id="txtID"]').val();
    var id = txtIDValue;
    alert(id);
}

$('input[id="txtID"]') 将找到元素 <input type="text" id="txtID" value='whatYouAreTryingToFind' /> 并为其创建一个 jQuery 选择器。

提示：在 jQuery 中，$(this) 的事件范围可能很有趣，因此请始终检查它返回的确切内容 Scope and this in JavaScript。

【讨论】：