javascript - jquery 选择器出现问题

Question

我正在构建一个网页，其中包含有关我们公司可以执行的各种分析的信息。我尝试设置的部分是对每个分析进行高级概述，然后使用“更多详细信息”按钮打开一个包含更深入信息的对话框。

如果我使用多行代码来显式引用每个按钮和每个对话框的 ID，我就可以正常工作。但是当我尝试使用选择器使其只是几行代码时，我无法再让它工作了。

以下是一些 HTML:

<div id="van_westendorp" class="solution price1">
    <h3 class="solution_header"><a href="#">Van Westendorp</a></h3>

    <div class="solution_content">
        <ul class="overview">
            <li><em>Price:</em> 
                <div class="dollar ui-state-default ui-corner-all"><img src="images/dollar.png"></div>
                <div class="dollar ui-state-default ui-corner-all"><img src="images/dollar.png"></div>
            </li>
            <li><em>Time:</em> 3-5 days</li>
            <li><em>Pros:</em></li>
                <ul>
                    <li>Easy task for the respondent.</li>
                    <li>Prices can be open-ended.</li>
                </ul>
            <li><em>Cons:</em></li>
                <ul>
                    <li>Deliverables imply more precision than actually exists.</li>
                    <li>Heavy reliance on respondents' understanding of questions.</li>
                </ul>
        </ul>

        <div id="van_westendorp_link" class="center">
            <button class="ui-state-default ui-corner-all detail">More Details</button>
        </div>

        <div id="van_westendorp_window" class="dialog" title="Van Westendorp Details">
            <h2 class="center">How It Works</h2>
            <ul>
                <li>Things happen.</li>
                <li>It's awesome.</li>
            </ul>
            <h2 class="center">Why It Works</h2>
            <ul>
                <li>Science!</li>
            </ul>
        </div>
    </div>
</div>

ID 为“van_westendorp_link”的 div 是按钮，ID 为“van_westendorp_window”的 div 是应打开的对话框窗口。

这是我在 Javascript 中尝试过的最新版本:

$("[id$='link']").click(function(){
    $(this).next("[id$='window']").dialog('open');
    event.preventDefault();
});

第一行代码有效；如果我将第二行替换为对对话框 ID 的显式引用，则一切正常。正是在第二行，我尝试使用选择器引用对话框，这让我很困惑。

我正在使用查询 UI 来获取对话框代码(如果这很重要的话)。有什么想法为什么我无法正确引用对话框吗？

Answer 1

您忘记了函数参数中的事件:

$("[id$='link']").click(function(event){
                                   ^
                                  here