【问题标题】:jQuery Mobile .delegate( ) not triggeredjQuery Mobile .delegate() 未触发
【发布时间】:2012-01-26 13:24:47
【问题描述】:

我对 jQuery 还很陌生,我在与委托相关的问题上有些挣扎。 在我的代码中,我加载了一个动态页面:

    $("#results").delegate('li', 'click', function(evt){
      var queryData = "id=" + $(this).attr("id");
      if ( $(this).attr("id") ){
        $.ajax({
          type: "GET",
          url:  "wiw_detail_page.html",
          data: queryData,
          beforeSend: onDetailBeforeSend,
          success: onDetailSuccess,
          error: onError
        });
      }
      else
      {
        alert("Please select an Employee from the list");
      }
        return false;
    });

这是 onDetailSuccess 函数:

    function onDetailSuccess( data, status ){
      $("body").append( data );
      $("#wiw_detail_page").page( );
      $.mobile.changePage( "#wiw_detail_page", { transition: 'slide' } );
    }

一切正常,因为我将第一页移至“wiw_details_page”。 在新页面中,我有一个字段列表,位于可折叠下方,如下所示:

  <div data-role="collapsible" data-collapsed="false" data-theme="b" id="comData">
    <h2>Communication Data</h2>
    <div id="communicationData">
      <fieldset>
        <label for="address">Address:</label>
        <a href="#locationMap">
          <input class="goMap" type="text" 
                 name="address" id="address" 
                 disabled="true" 
                 value="<%=employeeprofile-building%>"/>
        </a>
      </fieldset>
    </div>
  </div>

我需要在地址输入字段上附加一个点击处理程序,并且由于此页面尚未在 $(document).ready() 处创建,因此我向它附加了一个委托,如下所示:

    // Use delegation, since detail view is not availble at document.ready time:
    $("#wiw_detail_page").delegate('input.goMap','click', function(evt){
      if ( $(this).attr( "id" ) == 'address' ){
        alert("Click!");
        if ( navigator.geolocation ) {
          detectBrowser( );
          navigator.geolocation.getCurrentPosition( function( position ){
            newInitialize( position.coords.latitude, position.coords.longitude );
          })
        }else{
          detectBrowser( );
          newInitialize(45.06150, 7.65599);
        }
      }
     });

    });

这个委托永远不会发生,当我点击输入字段时,什么也没有发生(甚至没有任何错误)。

我也尝试将选择器更改为:

    $("#comData").delegate('input.goMap','click', function(evt)

作为绝望的尝试,我将其更改为:

    $("body").delegate('input.goMap','click', function(evt)

有什么线索吗?

抱歉问了这么长的问题,在此先感谢您, R.

【问题讨论】:

  • 你用的是什么版本的jQuery和jQueryMobile?
  • jquery-1.7.1.min.js 和 jquery.mobile-1.0.min.js
  • jQM 只支持 jQuery 版本 1.6.4,我建议降级并回发,更多在这里:jquerymobile.com/blog/2011/11/16/announcing-jquery-mobile-1-0
  • 感谢 Phill,但不起作用。无论如何,我无法弄清楚为什么其他 .delegate() 方法在 1.7.1 中起作用
  • 您有示例链接吗?也许jsfiddle.net

标签: jquery jquery-mobile delegation


【解决方案1】:

您想试试#communicationData,如:

$("#communicationData").delegate('input.goMap','click', function(evt) {...}

【讨论】:

    猜你喜欢
    • 2013-02-14
    • 1970-01-01
    • 1970-01-01
    • 2016-09-07
    • 2017-08-27
    • 2012-02-21
    • 1970-01-01
    • 2013-03-20
    • 1970-01-01
    相关资源
    最近更新 更多