Question

我想在点击链接后运行一个函数。

我想指向该函数的链接是具有cancelLink类的链接。第一个链接在这里向您展示如何通过将参数传递到另一个页面来获取AppointmentId第一个链接。

我希望能够点击取消链接并在当前页面上运行一个功能。

以下是我的链接：

<a href="Invoices/InvoiceCreate.aspx?AppointmentId=${AppointmentId}">Invoice</a>&nbsp;|
<a href="#" class="cancelLink" data-attr=${AppointmentId}>Cancel</a>

以下是我的点击功能，该功能位于文档准备状态下：

$('a.cancelLink').click(function () {
   var appointmentId = $(this).attr("data-attr");
   //var appointmentId = $(this).attr("appointmentId");
   MemberWebService.AppointmentStatusUpdate(appointmentId, 3, function () {

   window.location = 'AppointmentViewAll.aspx';
   });
 });

目前代码没有进入此点击功能，我怎么能实现这个？

Answer 1

你的代码对我来说似乎没问题。这是一个有效的plunk。你试过放一个'console.log（“样本测试”）;'在你的点击处理程序中，看它是否正在开火？你能否发帖说明如何将代码包装在$（document）.ready（）？

中

你这样做了吗？

$(document).ready(function() {
   $('a.cancelLink').click(function () {
       var appointmentId = $(this).attr("data-attr");
       //var appointmentId = $(this).attr("appointmentId");
       MemberWebService.AppointmentStatusUpdate(appointmentId, 3, function () {

       window.location = 'AppointmentViewAll.aspx';
   });
 });
});

Answer 2

试试这个：

$('a.cancelLink').click(function (e) {
  e.preventDefault();
  var appointmentId = $(this).attr("data-attr");
   //var appointmentId = $(this).attr("appointmentId");
   MemberWebService.AppointmentStatusUpdate(appointmentId, 3, function () {

    window.location = 'AppointmentViewAll.aspx';
  });
});

我希望它有所帮助。

Answer 3

我发现了一些可能的原因，请参阅我的评论;

HTML

<a href="Invoices/InvoiceCreate.aspx?AppointmentId=${AppointmentId}">Invoice</a>
<a href="#" class="cancelLink" data-attr="${AppointmentId}">Cancel</a> // Use quotes

的Javascript

$(document).ready(function() { // Only access elements once the DOM is loaded

  $(document).on('click', 'a.cancelLink', function(event) { // Try using on() instead of click() as you seem to be using some templating for creating the link ("${AppointmentId}").

    event.preventDefault(); // Don´t follow the link to #

    var appointmentId = $(this).data('attr'); // Use data() instead of attr()
    console.log(event.type, appointmentId); // View your console

    MemberWebService.AppointmentStatusUpdate(appointmentId, 3, function() {
       window.location = 'AppointmentViewAll.aspx';
    });
  });

});

请参阅on()和data()。

Answer 4

使用onclick方法调用函数并添加参数。

<a href="#" onclick="bindCancel(${AppointmentId})">Cancel</a>

function bindCancel(appointmentId) {
    MemberWebService.AppointmentStatusUpdate(appointmentId, 3, function () {

    });
}

点击链接执行功能？

4 个答案: