Question

我正在尝试使用php显示数据库表。当页面加载时我需要显示所有表数据，当我选择下拉选择时，我需要只显示与之相关的数据，即使用条件。我不需要任何SQL查询或PHP代码，我只需要jquery。

$(document).ready(function() 
{
    $('#myHref').change(function()
    {
                var value = $('#myHref').val();
                $.get('get_projectName.php',{id:value},function(data)
                { 
                    $('#projectDetail').html(data);
                }); 
    }); 
    $('#myHref').on('change',function()
    {
        $('#projectDetail').fadeIn();
    });
});

当我选择下拉菜单id="myHref"执行get_projectName.php时，我需要在选择下拉列表之前加载页面时执行get_projectName.php，这样我就可以显示所有数据

Plz帮助!!

Answer 1

bt我需要在选择下拉列表之前加载页面时执行get_projectName.php，这样我才能显示所有数据

所以我看到你想在页面加载时初始加载执行get_projectName.php，如果下拉列表中有任何更改，也会执行它。所以你可以这样做

$(document).ready(function() {
    //make a call initially on page load
    var firstOptionValue = $("#myHref option:eq(1)").val() // take first option value as default
    $.get('get_projectName.php',{id:firstOptionValue},function(data)
    { 
      $('#projectDetail').html(data);
    }); 


    $('#myHref').change(function(){
        var value = $('#myHref').val();
        $.get('get_projectName.php',{id:value},function(data)
        { 
          $('#projectDetail').html(data);
        }); 
    }); 

    $('#myHref').on('change',function(){
      $('#projectDetail').fadeIn();
    });
});

重构代码，您可以将公共逻辑拉出到函数中并通过传递所需的值来调用该函数，参见下文

$(document).ready(function() {
    //make a call initially on page load
    var firstOptionValue = $("#myHref option:eq(1)").val(); // take first option value as default
    GetProjectDetails(firstOptionValue);


    $('#myHref').change(function(){
        var value = $('#myHref').val();
        GetProjectDetails(value);
    }); 

    $('#myHref').on('change',function(){
      $('#projectDetail').fadeIn();
    });

    function GetProjectDetails(value){
     $.get('get_projectName.php',{id:value},function(data)
     { 
       $('#projectDetail').html(data);
     });
    }
});

Answer 2

在上面的代码中，当您更改下拉列表时，您尝试通过$ .get（）将所选的id传递给php文件。没关系，如果要在加载页面时显示所有数据，那么你应该有另一个php，它返回db中的所有数据并且不带任何值。并编写如下代码

$(document).ready(function() {
        $.get('get_allDataFromDb.php',function(data)
            { $('#projectDetail').html(data);
        });
        $('#myHref').change(function(){
            var value = $('#myHref').val();
            $.get('get_projectName.php',{id:value},function(data)
                 { $('#projectDetail').html(data);
            });
        }); 
        $('#myHref').on('change',function(){
            $('#projectDetail').fadeIn();
        });
});

Answer 3

您的脚本时看起来您的元素（例如#myHref）不存在。当你想在加载时显示所有数据时，只需调用函数，例如。

function getData(){//ajax here}
getData();

运行。有什么错误吗？或者可以提供帮助的东西？

Answer 4

function getData(value) {
    params = {};

    if value
        params.id = value;

    $.get('get_projectName.php', params, function (data) {
        $('#projectDetail').html(data);
    });
}
// Get Data onLoad
getData($('#myHref').val());

$('#myHref').on('change',function(){
    getData($('#myHref').val());
    $('#projectDetail').fadeIn();
});

Answer 5

试试这个

$(document).on("change", "#myHref" , function() {

// Your Code Here

});

如果它仍然无法使用，请告诉我。

Answer 6

好的，这是我的另一个答案，即如何在我们的文档准备就绪后触发某些事件。

希望这会对你有所帮助。

<script>
            $(document).ready(function(){

                //Function for AJAX Call
                function GetData(){

                    var value = $('#myHref').val();
                    $.get('get_projectName.php',{id:value},function(data)
                    { 
                        $('#projectDetail').html(data);
                        //
                        $('#projectDetail').fadeIn();
                        // Any other code here you want to write.

                    }); 

                }

                $('#myHref').change();
                //OR you can use
                $("#myHref").trigger("change");

            });            
            $(document).on("change", "#myHref" , function() {
                // Call the function as change evvent is triggered
                GetData();
            });
        </script>

如果页面加载，如何执行ajax

6 个答案: