jQuery Ajax通过链接发布

Question

I am trying to post via link. But I think there is a problem. I am not good at Javascript. I want to send attribute and show with div.

Here is my Code :

  <script type="text/javascript">
      $(document).ready(function() {
          $("#slidingProduct").click(function() {
              var aa = $(this).attr('urun_id');
              $.ajax({
                  url: "data.php",
                  dataType: "POST",
                  data: {
                      "number1": aa
                  },
                  success: function(json) {
                      $("#result").html(json.number1);
                  }
              });
          });
      });
  </script>
  <a href="#" id="slidingProduct" urun_id="apple">A</a>
  <a href="#" id="slidingProduct" urun_id="banana">B</a>
  <a href="#" id="slidingProduct" urun_id="orange">O</a>
  <div id="result"></div>

Answer 1

You can do something like this:

$(".slpd").on('click',function(){
      var aa = $(this).data('urun_id'); 
      var json={"number1":aa};
      $.ajax({
            url: "data.php", 
            type: "POST", 
            dataType:'JSON',
            data: JSON.stringify(json), 
            success: function(result){ 
                $("#result").html(result.number1); 
            }
      });
});

As ids in DOM should be unique, you can specify similar class name to capture click event in a single go and some modifications in html - It's good to use data-* property of html5:

<a href="#" id="slidingProduct1" class="slpd" data-urun_id="apple">A</a>
<a href="#" id="slidingProduct2" class="slpd" data-urun_id="banana">B</a>
<a href="#" id="slidingProduct3" class="slpd" data-urun_id="orange">O</a>