如何获取 data-esid 属性和 POST？答案

【问题标题】：How to get the data-esid attribute and POST?如何获取 data-esid 属性和 POST？
【发布时间】：2016-09-10 15:29:32
【问题描述】：

没有data-esid一切正常，我无法在data-esid中发送数据。

我的错误在哪里？

<a href="#" data-esid="123" data-lname="Saracoglu" onclick="goToWorld();">link1</a>

Javascript：

 function goToWorld() {
      var idno = $(this).data("esid"); 
      var last_name = $(this).data("lname");   
      var dataString = 'ESidNO='+idno+'&last_name='+last_name;

       $.ajax({
           type:'POST',
           data:dataString,
           url:'Lib/Path/Page.php',
           success:function(data) {
               alert(data);
           }
       });
 return false;
 }

【问题讨论】：

访问“data-esid”，可以使用element.dataset.esid....

标签： javascript php ajax post

【解决方案1】：

无论有没有esid，我根本看不出这怎么能工作。问题是无论this 在你的函数上下文中，它不是你点击的链接。

您也没有取消点击事件，您返回false，但您没有在您的内联点击处理程序中使用该值。但是，这只会导致页面跳转到顶部，因为链接是#。

解决这个问题的最简单方法是将处理程序附加到链接上，例如使用一个类。

结果会是这样的：

<a href="#" data-esid="123" data-lname="Saracoglu" class="goToWorld">link1</a>

javascript：

$('.goToWorld').on('click', function(e) {
      // Now $(this) is the link that was clicked
      var idno = $(this).data("esid"),
          last_name = $(this).data("lname");

      // Cancel the default click event
      e.preventDefault();

      $.ajax({
           type: 'POST',
           data: {
                ESidNO: idno, 
                last_name: last_name
           },
           url: 'Lib/Path/Page.php',
           success: function(data) {
               alert(data);
           }
      });
});

请注意，我还用一个对象替换了数据，以便正确转义这些值。这不会对示例代码产生影响，但当您的值包含必须在 url 中转义的字符时会产生影响。

【讨论】：

var last_name -> var 你删了，我们为什么不需要？
@Saracoglu 您可以在定义变量时用逗号分隔它们。我只是出于习惯...
如果结果成功，我可以用图片代替alert吗？
@Saracoglu 当然，例如，您可以添加隐藏类的图片，然后在 success 函数中删除该类。或者添加一个全新的图像。

【解决方案2】：

你必须在{}中传递数据

代替你的dataString，试试这个：

newData = {ESidNO: idno, last_name: last_name}

【讨论】：