0

所以我研究并玩了很多例子，但现在浪费了一个阳光明媚的日子，所以我寻求帮助。

我有一个基本的 php 页面，它使用一个按钮显示摩托车链信息，我使用该按钮调用另一个 php 脚本来填充模态 JQuery 框。此页面按预期从脚本调用填充并显示数据，一切看起来都很好。

所以现在我之前为链接构建的事件处理程序没有按预期触发，我的问题是我什么时候绑定我的链接，我想在从 ajax 脚本填充数据之后。

我到处都试过了，下面是代码片段，希望有人能看到我的错误或错误。

我知道其他人也在同一条船上，或者至少有过解决这个常见问题的经验。

再次感谢！

$(function() {  

    // Attempt at Getting binding to work after 
    // Dynamically generated code from ajax call
     $( ".chainSelected" ).on('click', 'a', function(event) {
         alert('clicked');
         event.preventDefault();
         return false;
     });

      $( "#dialog-form" ).dialog({
          autoOpen: false,
          height: 400,
          width: 750,
          modal: true,
            Cancel: function() {
                      $( this ).dialog( "close" );
              }             
        });

        $( "#selectChain" )
          .click(function(event) {
            if($('#pitch').val() == '*' ) {
               event.preventDefault();
               alert ('You have to pick a chain pitch first.');
               $('#pitch').focus();
            } else {

                $.ajax({
                      type: 'GET',
                      url: 'includes/select-chain.php',
                      data: { pitch: +  $('#pitch').val() },
                      beforeSend:function(){
                        // load a temporary image in a div
                      },
                      success:function(data){
                        $('#dialog-form').html(data);
                      },
                      error:function(){
                        $('#dialog-form').html('<p class="error"><strong>Oops!</strong></p>');
                      }
                    });

                 $( "#dialog-form" ).dialog( "open" );  

          }

          });

        /* Once a chain is selected update the contents to the form field for storing */
        $( ".chainSelected" )
          .click(function() {
            $partNumber = $( this ).attr('href');
            $partNumber = $partNumber.substring(1);
            $partDesc = $(this).text();
            $( "#chainSelectedPartNumber").val( $partNumber );
            $( "#chainSelectedDesc" ).text( $partNumber + '-' + $partDesc );
            $( "#linkedChainPartDescription").val( $( "#chainSelectedDesc" ).text() );
            // Reformat the part number per Brian's Request
            $masterPartNumber = $('#masterPartNumber').val();
            if( $masterPartNumber.indexOf('-') != -1) {   // xxxxxxxx-9
                hyph = $masterPartNumber.indexOf('-');
                $masterPartNumber = $masterPartNumber.substr(0, hyph) + '-' + $(this).attr('alt');
            } else {
                $masterPartNumber = $masterPartNumber + "-" + $(this).attr('alt');
            }               
            $('#masterPartNumber').val( $masterPartNumber );  // main part number
            $( "#dialog-form" ).dialog( "close" );

          });
});        



</script

这是弹出的 HTML 标记的样子

<a href="#DA520ERT2" alt="1" class="chainSelected">D.I.D. 520ERT2 GOLD PLATED LIGHTWEIGHT NON-O'RING OFF-ROAD CHAIN (450cc Rated) </a>
4

1 回答 1

1

没有必要推迟绑定事件处理程序；使用事件委托从父元素监听

 // or some other more immediate parent element
 $( "body" ).on('click', 'a.chainSelected', function(event) {
     alert('clicked');
     event.preventDefault();
     return false;
 });
于 2013-07-13T21:23:21.607 回答