1

我正在尝试将 AJAX 用于我正在制作的网络应用程序游戏。

简而言之，我有以下 HTML：

<li id='fight'><div id='change'></div></li>

在下面的 JS 中，您会看到当用户单击“战斗”时，会运行一个脚本来替换 'main' 中的内容

我还希望用户能够选择单击应该在“战斗”内部的“更改”并让它也更改为主要内容。

当前，当用户单击“更改”时，它会运行脚本，更改主脚本，然后运行“战斗”并再次更改。

当用户点击它时，我只需要运行“更改”。

JS：

$("#fight").click(function() {
    var page = 'fight';
    getmain(page)
});

$("#change").click(function() {
    var page = 'change';
    getmain(page);
    evt.stopPropagation();
});

function getmain(page){
     $.ajax({
            type: "POST",
            async: false,
            url: 'welcome/loadmain',
            dataType: 'json', 
            data: { page: page },
            success: function(content){
                var html = '';
                html += content['content'];
                $('#main').html(html);
            }
        });    
}

$.ajax({
    type: "POST",
    async: false,
    url: 'welcome/loadmain',
    dataType: 'json', 
    data: { page: 'get_zone' },
    success: function(content){
        var html = '';
        html += content['content'];
        $('#fight').html(html);
    }
});

HTML

    public function get_zone()
    {
        $user_id = $this->tank_auth->get_user_id();
        $itemroll = $this->db->query("SELECT current_zone, z.name FROM user_load ul
                                    INNER JOIN zones z
                                    ON z.id = ul.current_zone
                                    WHERE ul.user_id = $user_id");
        $result = $itemroll->row_array();
        $zone['current_zone']= $result['current_zone'];
        $zone['name'] = $result['name'];
        //HTML Formatting
        $content = '';
        $content .= "<div id='zonename'>Zone = ". $zone['name']. "</div>";
        $content .= "<div id='change'>Change Zone</div>";
        return $content;
    }
4

2 回答 2

4

改变

$("#fight").click(function() {
    var page = 'fight';
    getmain(page)
});

至

$("#fight").click(function(e) {
    if ($(this).is(e.target)) {
        var page = 'fight';
        getmain(page);
    }
});

这使得仅当事件目标是事件绑定到的元素时才处理事件。

于 2012-06-25T19:34:22.823 回答
4

您需要将事件传递给更改函数：

$("#change").click(function(evt) {
  evt.stopPropagation();
  var page = 'change';
  getmain(page);
});
于 2012-06-25T19:35:40.140 回答