Codeigniter jQuery工具疊加在動態內容中

Question

我對jQuery工具和JavaScript有點新穎。我試圖谷歌/搜索這個論壇，但我可能不知道到底要搜索什麼。 事情是： 我有一個包含選項卡的頁面。 內。當按鈕被按下時使用取決於OS輸入文本它列出一些記錄 荷載

myUrl = '管理員/ listusers /' + MYSEARCH + '/' + pageNr + '/' 一個凸片;

 $("#userlist").html("<b>Loading user list...</b>"); 
     $("#userlist").load(myUrl); 

加載的內容包含要在Overlay中打開的鏈接。

我已經嘗試在所有3個位置（主頁面html，標籤內部html，動態內容本身）疊加代碼它仍然無法正常工作，它只是在同一個窗口中打開鏈接，就像普通的。

動態內容還包含另一個javascript函數和它的工作（用於分頁的onclick =「pagepress（PageNr）：

功能pagepress（pageNr）{ searchString的=的document.getElementById（ 'searchString的'）;

 if (searchstring.value != '') { 
      mySearch = searchstring.value; 
     } else { 
      mySearch="0"; 
     } 

     myUrl = 'admin/listusers/' + mySearch +'/'+ pageNr +'/'; 

     $("#userlist").html("<b>Loading user list...</b>"); 
     $("#userlist").load(myUrl); 
    } 

什麼可能是錯了嗎？或者，也許有人可以給我一個提示來尋找什麼？

感謝

Answer 1

HTML中，動態加載的是：

<script src="http://cdn.jquerytools.org/1.1.2/full/jquery.tools.min.js"></script> 

/*使用半透明圖像重疊*/

覆蓋{

/* initially overlay is hidden */ 
display:none; 

/* growing background image */ 
background-image:url(http://flowplayer.org/tools/img/overlay/white.png); 

/* 
    width after the growing animation finishes 
    height is automatically calculated 
*/ 
width:600px;   

/* some padding to layout nested elements nicely */ 
padding:35px; 

/* a little styling */ 
font-size:11px; 

}

/*外部內容的容器。使用垂直滾動條，如果需要*/ 。contentWrap { height：460px; width：600px; overflow-y：auto; }

    <!-- the external content is loaded inside this tag --> 
        <div class="contentWrap"></div> 

       </div> 

$（函數（）{

// if the function argument is given to overlay, 
// it is assumed to be the onBeforeLoad event listener 
$("a[rel]").overlay({ 

    expose: 'darkred', 
    effect: 'default', 

    onBeforeLoad: function() { 

     // grab wrapper element inside content 
     var wrap = this.getContent().find(".contentWrap"); 

     // load the page specified in the trigger 
     wrap.load(this.getTrigger().attr("href")); 
    } 

}); 

}）;

function pagepress(pageNr) { 
     searchstring = document.getElementById('searchstring'); 

     if (searchstring.value != '') { 
      mySearch = searchstring.value; 
     } else { 
      mySearch="0"; 
     } 

     myUrl = 'admin/listusers/' + mySearch +'/'+ pageNr +'/'; 

     $("#userlist").html("<b>Loading user list...</b>"); 
     $("#userlist").load(myUrl); 
    } 


<div id="pages">1 | <a href="http://localhost/~olegas/xxx/index.php" onclick="pagepress(1);return false;">2</a> | <a href="http://localhost/~olegas/xxx/index.php" onclick="pagepress(2);return false;">3</a> | </div> 

<div id="admin-user-table"> 
    <table width="100%" border="0" cellspacing="0" cellpadding="0" style="text-align:center;"> 

EditLoginEmailFirst nameLast nameCompany namePhoneCurrencyCountry

<tr class="left-table-border"><td><a href="http://localhost/~olegas/xxx/index.php/admin/edit_user/1" rel="#overlay">Edit</a></td><td>admin</td>td>admin@localhost.com</td><td></td><td></td><td></td><td></td><td></td>td></td></tr> 

Answer 2

這是我做過什麼來解決我的問題

<script> 
    $(function() { 
     var overlayElem; 
     $("a.overlayLink").live("click", function (e) { 
      e.preventDefault(); 
      overlayElem = $(this); 
      overlayElem.overlay({ mask: 'lightgray', effect: 'apple', 
       onBeforeLoad: function() { 
        //do something on load 
       }, 
       onClose: function() { 
        //do something on close 
       }, 
       load: true 
      }); 
     }); 


     $("#save").click(function() { 
      //do something 
      $.ajax({ 
       type: "POST", 
       url: "some service", 
       data: "{some data}", 
       contentType: "application/json; charset=utf-8", 
       dataType: "json", 
       success: function (msg) { 
        //do something when success 
        overlayElem.overlay().close(); 
       }, 
       failure: function (msg) { 
        //do something when fail 
       } 
      }); 
     }); 
    }); 
</script> 

我希望這種幫助別人=）