Question

HTML：

<button class="btn btn-sm green btn-outline filter-submit margin-bottom" data-type="Invoice Generate" onclick="show_modal()"><i class="fa fa-envelope"></i></button>

jQuery的：

function show_modal(){
    alert($(this).data("type"));
    $('#basic').modal('show'); 
}

输出：

Undefined

预期产出：

Invoice Generate

任何人都可以告诉我它为什么警告未定义，我该如何解决？

Answer 1

您show_modal函数不知道$(this)是什么。所以将this添加到onclick="show_modal()"，如onclick="show_modal(this)"

然后，当然，您必须更新您的功能以及以下内容：

function show_modal(obj){
    alert($(obj).data("type"));
    $('#basic').modal('show'); 
}

＆＃13;

function show_modal(obj){
    alert($(obj).data("type"));
    $('#basic').modal('show'); 
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button class="btn btn-sm green btn-outline filter-submit margin-bottom" data-type="Invoice Generate" onclick="show_modal(this)"><i class="fa fa-envelope"></i></button>

＆＃13;

Answer 2

你正在调用你必须传递的功能，这将像

一样运作

<button class="btn btn-sm green btn-outline filter-submit margin-bottom" data-type="Invoice Generate" onclick="show_modal()"><i class="fa fa-envelope"></i></button>

在JS中

function show_modal(ob){
    alert($(ob).data("type"));
    $('#basic').modal('show'); 
}

Answer 3

或者如果你想使用$(this)使用它的类或id这样的元素附加一个事件处理程序..

$('.filter-submit').on('click', function(){
  alert($(this).data("type"));
})

＆＃13;

$('.filter-submit').on('click', function() {
  alert($(this).data("type"));
  //$('#basic').modal('show');
})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<button class="btn btn-sm green btn-outline filter-submit margin-bottom" data-type="Invoice Generate"><i class="fa fa-envelope"></i>Show</button>

＆＃13;

Answer 4

希望这是您的解决方案

<button class="btn btn-sm green btn-outline filter-submit margin-bottom" data-type="Invoice Generate" onclick="show_modal(this)"><i class="fa fa-envelope"></i></button>

<script>
   function show_modal(ele){

      alert($(ele).data("type"));
      $('#basic').modal('show'); 
   }
</script>

Jquery数据属性值未定义

4 个答案: