jQuery的onClick函数不工作 [英] jQuery onClick Function not working

问题描述

我有一个函数放在document.ready中，并且该函数是通过特定按钮的onclick调用的。点击按钮时没有任何反应。

  $（document）.ready（function（）
 {
 function myFunctionDelete（）
 {
 alert（Delete Clicked。）; 
} 
} 
  

这里是链接到该按钮的相应HTML。

 < form action =edit.phpmethod =POST> 
< table> 
< tr id =formTitlename =formTitle>< strong>现在编辑事件< / strong>< / tr> 
< input type =hiddenid =deletedHiddenname =deletedHiddenvalue =/> 
< input type =hiddenid =dateForm2name =dateForm2 value =/> 
< input type =hiddenid =titleEditOldname =titleEditOldvalue =/> 
< tr id =formTitle> < td>< label id =titleLabelfor =Title>< strong>标题：< / strong>< / label>< input id =titleEditname =titleEdit textvalue =Event Title> 
< tr id =formTitle>< td>< label for =startTimeHou rs>>< strong>时间：< / strong>< / option>< select id =startHoursname =startHours>< option>  - < / option> <选项> 12< /选项> <选项→1< /选项><选项→2< /选项> <选项→3< /选项><选项→4< /选项> 
< option> 5< / option>< option> 6< / option> 
< option> 7< / option>< option> 8< / option> 
< option> 9< / option>< option> 10< / option> 
< option> 11< / option>< / select> 
< select id =startMinutesname =startMinutes>< option>  - < / option> <选项> 00 LT; /选项> 
< option> 05< / option>< option> 10< / option> 
< option> 15< / option>< option> 20< / option> 
< option> 25< / option>< option> 30< / option> 
< option> 35< / option>< option> 40< / option> 
< option> 45< / option>< option> 50< / option> 
< option> 55< / option>< / select> 
 
< input type =radioname =AMPMvalue =am> am 
< input type =radioname =AMPMvalue =pm > PM<峰; br> 
< p>< strong>全天事件？< / strong> 
< input type =checkboxname =AllDayvalue =true>< / p> 
< tr id = formTitle>>< td>< input id =submittype =submitvalue =Submit> 
< button type =buttononclick =myFunctionDelete（）>删除事件< / button> 
< / table> 
  

myFunctionDelete 函数不能全局访问，因为它是在准备好的 / code>事件，您需要将该函数移出事件处理程序，换句话说，更改：

 < code $ $（document）.ready（function（）
 {
 function myFunctionDelete（）
 {
 alert（Delete Clicked。）; 
收件人：
 
  
 
 
 $ b  pre $  $（document）.ready（function（）
 {
 //当DOM准备就绪时应该运行的任何代码
}）; 
 
 //这是一个全局函数
函数myFunctionDelete（）
 {
 alert（Delete Clicked。）; 
} 
  

I have a function that I placed inside the document.ready and the function is called from onclick of a specific button. Nothing happens when the button is clicked.

$(document).ready(function() 
{
    function myFunctionDelete()
    {
        alert("Delete Clicked.");
    }
}

and here is the corresponding HTML linked to that button.

<form action="edit.php" method="POST">
    <table>
    <tr id="formTitle" name="formTitle"><strong>Edit Event Now</strong></tr>
    <input type="hidden" id="deletedHidden" name="deletedHidden" value="" />
    <input type="hidden" id="dateForm2" name="dateForm2" value="" />
    <input type="hidden" id="titleEditOld" name="titleEditOld" value="" />
    <tr id="formTitle"><td><label id="titleLabel" for="Title"><strong>Title:</strong></label><input id="titleEdit" name="titleEdit" type="text" value="Event Title">
    <tr id="formTitle"><td><label for="startTimeHours"><strong>Time:</strong></label><select id="startHours" name="startHours"><option>--</option>                                                                                        <option>12</option>                                                                                         <option>1</option><option>2</option>                                                                                        <option>3</option><option>4</option>
                                                                                          <option>5</option><option>6</option>
                                                                                          <option>7</option><option>8</option>
                                                                                          <option>9</option><option>10</option>
                                                                                          <option>11</option></select>
    <select id="startMinutes" name="startMinutes"><option>--</option>                                                                                         <option>00</option>
                                                                                          <option>05</option><option>10</option>
                                                                                          <option>15</option><option>20</option>
                                                                                          <option>25</option><option>30</option>
                                                                                          <option>35</option><option>40</option>
                                                                                          <option>45</option><option>50</option>
                                                                                          <option>55</option></select>

    <input type="radio" name="AMPM" value="am">am
    <input type="radio" name="AMPM" value="pm">pm<br>
    <p><strong>All Day Event?</strong>
    <input type="checkbox" name="AllDay" value="true"></p>                                                                
    <tr id=formTitle"><td><input id="submit" type="submit" value="Submit">
    <button type="button" onclick="myFunctionDelete()">Delete Event</button>
    </table>

解决方案

The issue is that your myFunctionDelete function is not accessible globally, as it's defined within the ready event for the document. You'll need to move the function out of the event handler. In other words, change:

$(document).ready(function() 
{
    function myFunctionDelete()
    {
        alert("Delete Clicked.");
    }
}

To:

$(document).ready(function()
{
   // Any code that should be run when the DOM is ready
});

// This is now a global function
function myFunctionDelete()
{
   alert("Delete Clicked.");
}

这篇关于jQuery的onClick函数不工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！