Question

我需要帮助创建一个jquery函数，该函数会在单击图像时显示弹出消息。每个图像都有不同的弹出消息。这是我的HTML代码：

<table>
<tr>
    <td>
        <a href="#">
            <img src="/face.jpg" />
            <span>
                <div class="bubble">
                    THIS IS MY POPUP MESSAGE 1
                </div>
            </span>
        </a>    
    </td>   

    <td>
        <a href="#">
            <img src="/face.jpg" />
            <span>
                <div class="bubble">
                    THIS IS MY POPUP MESSAGE 2
                </div>
            </span>
        </a>    
    </td>

    <td>
        <a href="#">
            <img src="/face.jpg" />
            <span>
                <div class="bubble">
                    THIS IS MY POPUP MESSAGE 3
                </div>
            </span>
        </a>    
    </td>
</tr>

Answer 1

我会给你与问题相同的答案。但是，我的调整是你必须包含jQuery UI

<强> CSS

a span {display: none}

下载并包含jQuery UI

<强> HTML

<script src="javascripts/jquery-ui.js"></script>

<强> JS

$('a').click(function() {
  $(this).find('span').dialog();
})

根据单击的内容显示不同的弹出消息

1 个答案: