Jquery 模式窗口将不会打开

我正在尝试向我的网页添加模式窗口选项。这是一个搜索页面，当单击每个搜索结果时，链接将在模式窗口中打开。因此，我使用了页面中的代码，除了jquery模板部分之外，页面中的模式窗口随处可见。我的模板编码是这样的

<script id="srch1" type="text/x-jquery-tmpl"> 
        <tr><td><div id="title"><a href="#dialog" name="modal" style="text-decoration:none; color:#333333;"><b>${_source.Title}</b></a></div></td></tr>
        <tr><td><div id="date">${_source.fetchTimeStamp}&nbsp;|&nbsp; ${_source.SourceName}</div></td></tr>
        <tr><td><div id="content">${_source.Content}</div></td></tr>
</script>

})

还有纯HTML部分

<div id="boxes">
<div id="dialog" class="window">
Simple Modal Window | 
<a href="#" class="close"/>Close it</a>
</div>
 <div id="mask"></div>
</div>

---

您的代码似乎很好，我将其粘贴到JSFIDLE中，其行为应该是：

你能试试看有没有JS错误吗

可能是在加载dom后插入了链接，因此未列出该链接。尝试使用LIVE函数

$('a[name=modal]').live("click", function(){
    //Cancel the link behavior
    e.preventDefault();

    //Get the A tag
    var id = $(this).attr('href');

    //Get the screen height and width
    var maskHeight = $(document).height();
    var maskWidth = $(window).width();

    //Set heigth and width to mask to fill up the whole screen
    $('#mask').css({'width':maskWidth,'height':maskHeight});

    //transition effect     
    $('#mask').fadeIn(1000);    
    $('#mask').fadeTo("slow",0.8);  

    //Get the window height and width
    var winH = $(window).height();
    var winW = $(window).width();

    //Set the popup window to center
    $(id).css('top',  winH/2-$(id).height()/2);
    $(id).css('left', winW/2-$(id).width()/2);

    //transition effect
    $(id).fadeIn(2000); 
});

---

代码很好…它在零件内部工作！！当我把链接放在jquery模板中时，它不会打开。你发布的代码和链接很混乱。。。试着把它归结为不起作用的东西。你的链接是否有一个带有值模式的属性名，当你点击它时是否加载了jquery？我只粘贴了相关部分。我会解释的。我添加的html部分用于模式窗口。它们是隐藏的，只有在单击搜索结果链接时才会显示。所以，一旦我输入了一个搜索词，我就会得到搜索结果，点击每个链接就会激活一个模式窗口，显示该链接的内容。第一个脚本部分用于jquery模板显示包含搜索结果的数组。是的，我有一个名为modal的attibute。。这是我粘贴的第一个代码…我注意到您缓存了元素的“id”值。。为什么不将$id也存储在本地变量中，而不是每次都用DOM调用将其包装起来呢？是的。这很好…但当我将它们链接放在头标记中的jquery模板中时，它就不会工作了。。这是我提供我的链接的地方，如果它被输出到浏览器中，模板本身似乎有问题。您正在调用$.template。。。；作用如果输出错误，则可能是您没有编译它，也可能是编译时出错。我使用.tmpl函数并将其附加到div中，然后得到输出。当我们将鼠标移动到每个标题上时，它会将光标显示为一个链接。但是当我们单击链接时，模式窗口将不会打开，因为我指定了href作为对话框，对话框将附加到地址栏中的网页地址…哈哈，太好了！我猜jQuery确实将tmpl加载到dom中了，真奇怪

$('a[name=modal]').live("click", function(){
    //Cancel the link behavior
    e.preventDefault();

    //Get the A tag
    var id = $(this).attr('href');

    //Get the screen height and width
    var maskHeight = $(document).height();
    var maskWidth = $(window).width();

    //Set heigth and width to mask to fill up the whole screen
    $('#mask').css({'width':maskWidth,'height':maskHeight});

    //transition effect     
    $('#mask').fadeIn(1000);    
    $('#mask').fadeTo("slow",0.8);  

    //Get the window height and width
    var winH = $(window).height();
    var winW = $(window).width();

    //Set the popup window to center
    $(id).css('top',  winH/2-$(id).height()/2);
    $(id).css('left', winW/2-$(id).width()/2);

    //transition effect
    $(id).fadeIn(2000); 
});