下拉菜单引导 PHP

Dropdown-menu Bootstrap PHP

本文关键字：PHP 下拉菜单      更新时间：2023-09-26

我正在尝试使用 AJAX 从 PHP 页面发送数据，但我无法理解这是如何工作的，我将解释到目前为止我所做的。

引导下拉列表：

<div class="btn-group">
    <button class="btn btn-danger btn-lg dropdown-toggle" type="button" data-toggle="dropdown" aria-expanded="false">
        BOTÂO <span class="caret"></span>
    </button>                   
    <ul class="dropdown-menu" role="menu" id="status">
        <li data="1"><a href="#">valor 1</a></li>
        <li data="2"><a href="#">valor 2</a></li>
    </ul>
</div>

阿贾克斯：

$(document).on('click','#status li',function(){
    $.ajax({
        url  : 'exemple.php',
        type : 'POST',
        data : {
               'valor' : $('#data').val()
        },
    });
});

我将 AJAX 更改为：

$(document).on('click','#status li',function(){
    $.ajax({
        url  : 'exemple.php',
        type : 'POST',
        data : {
            'valor': $(this).attr('data')
        },
    });
});

但也不行。请问有什么想法吗？

data属性的格式应该是：data-something="foo"。
然后可以使用jQuery的.attr() （或.data()）方法轻松访问它。

HTML：

<div class="btn-group">
    <button class="btn btn-danger btn-lg dropdown-toggle" type="button" data-toggle="dropdown" aria-expanded="false">
    BOTÂO <span class="caret"></span>
    </button>                   
    <ul class="dropdown-menu" role="menu" id="status">
        <li data-something="1"><a href="#">valor 1</a></li>
        <li data-something="2"><a href="#">valor 2</a></li>
    </ul>
</div>

脚本：

为了在 Ajax 调用中获得服务器响应，您应该添加success（当事情正常时）和error（当事情出错时）回调：

$(document).on('click','#status li',function(){
    var dd_val = $(this).attr('data-something');
    $.ajax({
        url     : 'exemple.php',
        type    : 'POST',
        data    : { valor : dd_val},
        success : function(data){
            // do anything with server response when success:
            console.log(data);
        },
        error   : function(jqXHR, textStatus, errorThrown ){
            // do anything when error
            console.log(textStatus + ' ' + errorThrown);
        }
    });
});

演示

相关文章：