jQuery focusout方法在jquery Tabs中不起作用

时间:2011-11-09 22:02:35

标签: jquery asp.net jquery-ui webforms

在ascx(usercontrol)中我创建了一个包含许多字段的标签部分

<div id="divTabs" style="height:320px;">
<ul class="tabs">
    <li><a href="#person">Person</a></li>
    <li><a href="#vehicle">Vehicle</a></li>
    <li><a href="#property">Property</a></li>
    <li><a href="#location">Location</a></li>
    <li><a href="#event">Event</a></li>
    <li><a href="#queryfields">Query Fields</a></li>
    <div class="panelbuttons" id="btnadvClose"><img alt="Close Advanced Search" runat="server" src="~/images/closeButton.png"  /></div>
</ul>
<!-- tab "panes" -->
<div id="person">
<div class="searchdiv">
        <span class="smLabel">Last Name</span><br />
        <input type="text" name="LastName" value="" size="30" />
    </div>
    <div class="searchdiv">
        <span class="smLabel">First Name</span><br />
        <input type="text" name="FirstName" value="" size="30" />
    </div>
    <div class="searchdiv">
        <span class="smLabel">Middle Name</span><br />
        <input type="text" name="MiddleName" value="" size="12" />
    </div>

...为简洁而编辑

我想要的是输入字段(在代码中进一步表示)更新,输入到文本框中的值以及用户选中该字段后

为此,我使用了以下jQuery代码

    function fieldUpdate() {

    var currentValue = $(this).val();
    var field = $(this).attr("name");

    if (currentValue != "") {
        $("#tbsearchterm").append(field + ":" + currentValue + "+");
    }
}

    //person
$(function () {
    //only evaluate input text field
    $("#person :input[type=text]").focusout(fieldUpdate);
});

我最初是在没有标签的测试页面上构建的,上面的代码工作正常。但是,当我将代码添加到UiTabs时,我什么也得不到。我甚至试图添加一个警报,看看我是否可以让焦点事件解雇,但没有。

我很欣赏任何关于我需要做些什么的指示,以便在jQuery UI选项卡中使用它。

提前致谢

1 个答案:

答案 0 :(得分:0)

似乎主控件嵌套在ajax更新面板的一侧。结果,该面板阻止代码触发更新。将pageLoad()函数添加到脚本的标题解决了此问题。

function pageLoad(){
    $(function () {

    $(function () {
        $("#divTabs").tabs();
    });

    function fieldUpdate() {

        var currentValue = $(this).val();
        var field = $(this).attr("name");

        if (currentValue != "") {
            alert(field + ":" + currentValue);
        }
    }
}