调用ajax函数onload并单击按钮

Question

我想根据选举日期显示报告。当我在表单上调用函数showReport（）时，它正在工作，但是当我在按钮点击时调用该函数时，它不起作用。

报告成员

<script>
function showReport(){
   var from = $('#from').val();
   var to = $('#to').val();
   var str = $('#str').val();
 if(from == '' && to == '')
 {
    var from = '$from';
    var to = '$to';
 }
$.ajax({
    url: "crm_data_report.php?type="+str+"&from="+from+"&to="+to,
    method: "POST",
    success: function(data) {
    console.log(data);
    var date = [];
    var value = [];
    for(var i in data)
    {
    date.push(data[i].date);
    value.push(data[i].value);
    }
    var color = Chart.helpers.color;
    var chartdata = {
    labels: date,
    datasets :
    [
    {
    label: 'Members',
    backgroundColor: color(window.chartColors.red).alpha(0.5).rgbString(),
    borderColor: window.chartColors.red,
    borderWidth: 1,
    data: value
    }
    ]
    };
    var ctx = $("#mycanvas");
    var barGraph = new Chart(ctx, {
    type: 'bar',
    data: chartdata
    });
    },
    error: function(data) {
    console.log(data);
    }
    });
}

代码我在加载和按钮点击时调用了该函数。

<script>
$(document).ready(function(){
   showReport();
});
$('#filter').click(function(){
    showReport();
});
</script>

Answer 1

用以下代码替换代码块：

$(function(){
    $('#filter').click(function(){
        showReport();
    });    
})

  

这是一个非常常见的问题，你绑定点击事件时   按钮不能用于dom，所以你必须在dom时绑定它   树准备好了。

Answer 2

这是预感，你的代码没有任何问题。你可以试试吗

<script>
$(document).ready(function(){
   showReport();
   $('#filter').click(function(){
    showReport();
   });
});
</script>

当您将点击处理程序附加到DOM时，DOM可能没有完全加载（#filter元素）。