Question

是否可以通过onclick函数从按钮向Jquery AJAX发送值？我尝试了类似这样的代码，但没有工作。控制台日志中没有任何内容。

HTML

<button type="button" class="hapus_krs" onclick="hapus_krs(this.value)" value="1">x</button> 
<button type="button" class="hapus_krs" onclick="hapus_krs(this.value)" value="2">x</button>
<button type="button" class="hapus_krs" onclick="hapus_krs(this.value)" value="n">x</button>

脚本

function hapus_krs() {
    var formData = {
        'id_mhs': $(this).val()
    };
    $.ajax({
            type: 'POST',
            url: '<?=base_url()?>akademik/hapus_krs',
            data: formData,
            dataType: 'json',
            encode: true
        })
        .done(function(data) {
            console.log(data);
        })
};

Answer 1

使用onclick="hapus_krs(this.value)"调用函数时，您已将按钮值作为参数传递给函数：

function hapus_krs(value) {
    var formData = {
        'id_mhs': value
    };
}

Unobtrusive JS版本：

<button type="button" class="hapus_krs" value="1">x</button> 
<button type="button" class="hapus_krs" value="2">x</button>
<button type="button" class="hapus_krs" value="n">x</button>

$('button.hapus_krs').click(function() {
    var formData = {
        'id_mhs': this.value // $(this).val() also works but it's unnecessary to invoke another jQuery call
    };
});

Answer 2

您可以使用解决方案https://jsfiddle.net/60qu6mev/

＆＃13;

$('.hapus_krs').click(function(){
var formData = {
  'id_mhs': $(this).attr('value')
};
console.log(formData);
$.ajax({
      type: 'POST',
      url: '<?=base_url()?>akademik/hapus_krs',
      data: formData,
      dataType: 'json',
      encode: true
  })
  .done(function(data) {
      console.log(data);
  })
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button type="button" class="hapus_krs"  value="1">x</button> 
<button type="button" class="hapus_krs" value="2">x</button>
<button type="button" class="hapus_krs" value="n">x</button>

＆＃13;

我已从HTML中删除 onclick ，而是使用 jQuery 点击事件来处理ajax调用和放大器;从按钮

中检索值

Answer 3

使用this时必须小心。在您的代码中，this可能不会引用已单击的按钮。

此外，您正在传递this.value作为参数但尚未使用它。所以你的功能应如下所示：

function hapus_krs(value) {
    var formData = {
        'id_mhs': value
    };
    $.ajax({
        type: 'POST',
        url: '<?=base_url()?>akademik/hapus_krs',
        data: formData,
        dataType: 'json',
        encode: true
    })
    .done(function(data) {
        console.log(data);
    })
};

使用onclick（）将按钮值发送到Jquery AJAX

3 个答案: