首页 > 解决方案 > 使用 jQuery 和 AJAX 加载页面时设置默认值

问题描述

我有以下jQuery UI 菜单结构:

<ul id="menu">
  <li value="100"><div>Books</div></li>
  <li value="200"><div>Clothing</div></li>
  <li value="300"><div>Electronics</div>
    <ul>
      <li value="500"><div>Car Hifi</div></li>
      <li value="600"><div>Utilities</div></li>
    </ul>
  </li>
</ul>

如果您单击一个<li>元素,则该值将通过 jQuery AJAX 发送到服务器端脚本:

jQuery(function ($) {
    
    $('ul#menu li').click(function () {

            var level = $(this).attr("value");

            $.ajax({
                type: "GET",
                cache: "true",
                url: "../level.php",
                data: {
                    "level": level
                },
                success: function (data) {
                    $('.item-content').html('<div class="tooltipitem-site"><div class="ui-tooltip-site">' + data + '</div></div>');    
                }
            });
        });

        $(function () {
            $("#menu").menu();
        });
});

目前,页面加载时没有发送任何值。如何更改它"value=0"在初始页面加载时发送默认值的脚本?

标签: jqueryajax

解决方案


这样的事情怎么样

jQuery(function($) {
    getResponse(0);
    $('ul#menu li').click(function() {
        var level = $(this).attr("value");
        getResponse(level);
    });

    $(function() {
        $("#menu").menu();
    });
});

function getResponse(level) {
    $.ajax({
        type: "GET",
        cache: "true",
        url: "../level.php",
        data: {
            "level": level
        },
        success: function(data) {
            $('.item-content').html('<div class="tooltipitem-site"><div class="ui-tooltip-site">' + data + '</div></div>');
        }
    });
}

推荐阅读