学习javascript的onclick事件函数

391 阅读1分钟

当一个按钮被点击时,javascript的onclick事件函数会执行某个动作或功能。这可能是当用户(客户)提交一个页面,当你改变网页上的某些内容,以及其他类似的事情。

你把你想执行或运行的JavaScript onclick按钮函数放在按钮的开口标签里。

语法

<element onclick="functionToExecute()">Click</element>

例子

<button onclick="functionToExecute()">Click</button>

代码

$(document).on( 'click', '.classname', function () { 
alert('clicked');
});
**** Another Method ****
// where #wrapper is a static element in which you add the dynamic links.
$( '#wrapper' ).on( 'click', 'a', function () { alert('clicked'); });

例子

按钮HTML

<input id="btnSearch" onclick="GetInfo();" type="button" value="Find ID" class="button-ffe" />

点击代码 (Click code)

function GetInfo() {
var term = $('#txtUtente').val();
$('#btnSearch').click(function () {
var winW = window.innerWidth;
var winH = window.innerWidth;
var dialogoverlay = document.getElementById('dialogoverlay');
dialogoverlay.style.display = "block";
dialogoverlay.style.height = winH + "px";

$.ajax({
     url: 'DAL/WebService1.asmx/GetPTSID',
     method: 'post',
     contentType: 'application/json;charset=utf-8',
     data: JSON.stringify({ term: term }),
     dataType: 'json',
     success: function (data) {
       document.getElementById('dialogoverlay').style.display = 'none';

       $('#infoFoundID').html(data.d[0]);
       $('#foundInfoMessage, #userInformation').show();
       $('#registerProductInfo').hide(); 
       var partTable = $('#partTable tbody');

       $(data.d).each(function (index, id) {
          partTable.append('<tr> <td>' + id + '</td><td>' + '<input onclick="GetPartNumber();" id="Button1" type="button" value="Copy Number" />' + '</td></tr>');
         });
       },
       error: function (err) {
       console.log(err);
     }
   });
 });
} //end getinfo

你可以删除第一个函数定义

var term = $('#txtUtente').val();

$('#btnSearch').click(function () {

var winW = window.innerWidth;
var winH = window.innerWidth;
var dialogoverlay = document.getElementById('dialogoverlay');
dialogoverlay.style.display = "block";
dialogoverlay.style.height = winH + "px";

$.ajax({
     url: 'DAL/WebService1.asmx/GetPTSID',
     method: 'post',
     contentType: 'application/json;charset=utf-8',
     data: JSON.stringify({ term: term }),
     dataType: 'json',
     success: function (data) {
       document.getElementById('dialogoverlay').style.display = 'none';

     $('#infoFoundID').html(data.d[0]);
     $('#foundInfoMessage, #userInformation').show();
     $('#registerProductInfo').hide(); 
      var partTable = $('#partTable tbody');

       $(data.d).each(function (index, id) {
        partTable.append('<tr> <td>' + id + '</td><td>' + '<input onclick="GetPartNumber();" id="Button1" type="button" value="Copy Number" />' + '</td></tr>');
       });
      },
      error: function (err) {
      console.log(err);
    }
  });
});