0

我知道，如果您使用 ajax 在带有表单元素的页面中加载 div，那么您必须使用 live 函数将事件添加到那些不在 dom 树中的元素......

而且我在 jQuery 网站上读到 live 功能目前不支持焦点，模糊等......

当通过ajax加载到div中的元素被聚焦或模糊时，我应该怎么做才能调用函数......？

是否应该使用绑定...？但是说到bind，虽然live和bind看起来有点像，但在上面提到的场景中是不能用的……对吧……？

这是代码....

<BODY style="">

    <div style="margin-top:5px; width:100%" class="subAndContent" id="subAndContent">
        <!-- TABLE TO HOLD SUB MENU-->
        <div id="subMenuDiv">
            <table width="100%" >
                <tr align="center" valign="middle">

                    <td width="100%" valign="middle"  class="rounded"  >

                        <div class="sidebarmenu">
                            <ul id="sidebarmenu1">
                                <li>
                                    <a href="javascript:ajaxLoadMainOnly('createHotel.php', 'content')" > <!-- This function get's the page to be loaded and the div into which it should be loaded and uses ajax to do the loading... -->
                                        HOTEL
                                    </a>
                                </li>
                                <li>
                                    <a href="javascript:ajaxLoadMainOnly('createCountry.php', 'content')" >
                                        COUNTRY
                                    </a>
                                </li>

                                <li>
                                    <a href="javascript:ajaxLoadMainOnly('createCity.php', 'content')">
                                        CITY
                                    </a>
                                </li>
                            </ul>
                        </div>

                    </td>
                </tr>
            </table>  <!-- END TABLE TO HOLD SUB MENU-->
        </div>

        <div id="contentDiv" class="rounded">
            <!-- TABLE TO HOLD CONTENT PANE-->
            <table width="100%" style="float:left;">
                <tr valign="left">
                    <td align="center">
                        <div id ="content">
                           <!-- Div into which the content will be loaded -->
                        </div>
                    </td>
                </tr>
            </table>
        </div>
    </div>

    <!-- DIV AND TABLE TO HOLD FOOTER -->
    <?php
    include 'footer.php';
    ?>


</BODY>
4

3 回答 3

1

您必须掌握动态加载的元素，然后使用绑定添加焦点和模糊处理程序。例如，如果您想将处理程序添加到具有“longtext”类的文本区域，您可能会使用如下内容：

$.getJSON('createHotel.php', { /* params go here */ }, receiveHotelCreated);

function receiveHotelCreated(data) {
    $('#content textarea.longtext').bind('blur', onTABlur);
}

function onTABlur() {
    var ta = $(this);  // The textarea on which the blur event occurred
    alert('Textarea blurred');
    // Your code goes here
}

onTABlur (TA = text area) 函数将在焦点离开 textarea 时调用。在函数内部，this指的是调用函数的元素。当我们收到 AJAX 响应 ( receiveHotelCreated) 时将其绑定到文本区域，这将是所需的文本区域元素。我们封装this了 jQuery 函数 ( $(this)) 以获得一些额外的功能。

于 2009-11-18T05:25:18.187 回答
0

我相信我读到下一个版本的 jQuery (1.4) 涵盖了 Live 的剩余事件。

但是现在，在 1.3 中，您需要使用绑定（或“单击”之类的快捷方式）。是的，如果您向页面添加元素并且 Live 无法满足您的操作，您需要绑定添加的内容。

“Live”的文档是一个很好的起点。如果您想处理 Live 尚未处理的事件，我认为您仍然可以使用 liveQuery 插件。

于 2009-11-18T04:43:59.483 回答
0

这是一个简单的例子：

每次调用 ajax 请求时，这都会取消绑定并重新绑定焦点事件。解除绑定只是为了安全并确保没有任何剩余事件。

$(document).ready(function() {
    focusEventFunction();
    ajaxLoader();
}

function ajaxLoader();

  $('#sidebarmenu1 a').unbind().bind('click', function(event){

    $.get('url_to_get.php', function(data) {

        // CODE THAT REPLACES DIVS AND DATA

        //The following has to be inside the ajax callback and 
        //after the code that changes divs. this will remap all the functions 
        //that bind the focus.

        $('selector_for_elements_needing_focus').unbind().bind('focus', function(event){
          focusEventFunction($(this), event)

          ajaxLoader();    //this ensures your ajax gets called again, 
                           //depending on the complexity of the html changes
                           //you may not need this.
        }
}


function focusEventFunction(jElement, event) {
  //just a dummy function that does your focus/blur stuff.
  // you might not need the parameters
}
于 2009-11-18T05:19:39.520 回答