jQuery .ready()函数在其他事件中使用

时间:2015-09-21 01:08:03

标签: javascript jquery

以下是我的.ready()功能:

$(document).ready(function()
{
    var Semester = $('#Semester').find(':selected').val();
    var StudentID = "<?php echo $_GET['id'];?>";
    $.ajax(
    {
        type: 'POST',
        url: 'ajax_get_report_for_edit.php', 
        data: {Semester:Semester, StudentID:StudentID},
        dataType: 'text',
        success: function(data)
        {
            if(data['error'] == null)
            {
                if(data['no_result'] == null)
                {
                    $('#display').html(data);
                }
                else
                {
                    //error msg
                }
            }
            else
            {
                alert("Error: " + data['error'])
            }
        },
        error: function(ts)
        {
            alert("AJAX Error: \n" + ts.responseText);
        }
    });
});

此功能将在页面加载时运行,但我想在.click()等其他事件中使用此功能。我需要重写该功能吗?

4 个答案:

答案 0 :(得分:2)

只需使用名称创建函数,并在任何地方使用它!例如:

$(document).ready(function(){

    function yourFunction(){
        var Semester = $('#Semester').find(':selected').val();
        var StudentID = "<?php echo $_GET['id'];?>";
        $.ajax(
            {
                type: 'POST',
                url: 'ajax_get_report_for_edit.php', 
                data: {Semester:Semester, StudentID:StudentID},
                dataType: 'text',
                success: function(data)
                {
                    if(data['error'] == null)
                    {
                        if(data['no_result'] == null)
                        {
                            $('#display').html(data);
                        }
                        else
                        {
                            //error msg
                        }
                    }
                    else
                    {
                        alert("Error: " + data['error'])
                    }
                },
                error: function(ts)
                {
                    alert("AJAX Error: \n" + ts.responseText);
                }
            });
    }

    yourFunction();

    $('#element').click(function(){
        yourFunction();
    });

});

答案 1 :(得分:2)

命名该函数并在您的点击事件中调用该函数。

样品:

<button id='btn'> click me </button>
$(document).ready(function(){
   foo();

   $("#btn").click(function(){
      foo();
   });

  function foo(){
      alert('data');
  }

});

<强> JSFIDDLE DEMO

答案 2 :(得分:0)

  

此功能将在页面加载时运行,但我想使用   此函数在其他事件中如.click()

尝试使用函数数组作为.ready()的参数,在数组中命名第一个函数,在第一个数组中将命名函数设置为thisdocument的属性;命名函数应该在数组中的第二个函数处可用作this的属性:document

&#13;
&#13;
$(document).ready([
  function fn() {
    this.fn = fn;
    console.log(this)
  },
  function() {
    $("div").click(this.fn)
  }
])
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js">
</script>
<div>click</div>
&#13;
&#13;
&#13;

答案 3 :(得分:0)

首先创建一个将在您的点击事件中调用的函数。请看下面的例子。

$(document).ready(function(){
$("#samplebutton").on("click",function(){
example();
 });

function example(){
alert("clicked");
}
 });