javascript - 单击不是函数错误

时间:2017-08-26 11:45:45

标签: javascript jquery html

我正在创建一个确认框,用户将点击删除,然后询问他们是否确定。

这是html

    <a href="" class="delete"  >Delete</a>

这是JS处理程序

        (function($){
              var deleteBox = '<span class="deleteBox"><p>Are you sure you want to delete?</p><span class="cancel">Cancel</span><span class="confirm">Yes</span></span>';
              $(document).on('click', '#deleteproduct', (function(){
                $(this).append(deleteBox);
              }).click(function(){
                if(!$(this).hasClass('selected')){
                  $(this).addClass('selected');
                  var owner = $(this);

                  $(this).find('.cancel').unbind('click').bind('click',function(){
                    owner.removeClass('selected');
                    return false;
                  })

                  $(this).find('.confirm').unbind('click').bind('click',function(){
                    $(this).parent().addClass('loading');
                    var parent = $(this).parent();

                    //ajax to delete

                    setTimeout(function(){ //On success
                      parent.addClass('deleted');
                      setTimeout(function(){
                        owner.fadeOut(600);

                        //remove item deleted

                        setTimeout(function(){
                          owner.find('.deleted').removeClass('loading').removeClass('deleted');
                          owner.removeClass('selected');
                          owner.show();
                        },1000) 
                      },1000)
                    },1000)

                    return false;
                  })
                }   
                return false;
              }));
      })(jQuery);

这是它显示的错误

   TypeError: (intermediate value).click is not a function at this line   ......  }).click(function(){

我该如何解决此错误?

3 个答案:

答案 0 :(得分:3)

您在.click上呼叫(function(){}),但$(document).on('click', '#deleteproduct', (function(){...})中的功能声明并未通过功能点击返回任何内容。相反,您可以创建类似下面的内容,在单击Delete product时添加html并使用jQuery将单击事件添加到html。

&#13;
&#13;
var deleteBox = '<span class="deleteBox"><p>Are you sure you want to delete?</p><span class="cancel">Cancel</span> <span class="confirm">Yes</span></span>';

$('#deleteproduct').click(function() {
  var $result = $('#result');
  var $popup = $('#popup');
  $result.text("");
  $popup.append(deleteBox);
  $popup.find('.cancel').click(function () {
    $popup.html("");
    $result.text("Cancelled");
  });
  $popup.find('.confirm').click(function () {
    $popup.html("");
    $result.text("Confirmed");
  });
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="deleteproduct">Delete product</button>
<div id="popup"></div>
<div id="result"></div>
&#13;
&#13;
&#13;

答案 1 :(得分:1)

问题是您尝试在click的结果中添加.on()处理程序,显然不受支持。如果要将处理程序添加到deleteBox,则需要

deleteBox.click(function() {/*Do something*/});

编辑:

这就是如何应用这个想法:

  (function($){
                  var deleteBox = '<span class="deleteBox"><p>Are you sure you want to delete?</p><span class="cancel">Cancel</span><span class="confirm">Yes</span></span>';
                  $(document).on('click', '#deleteproduct', (function(){
                    $(this).append(deleteBox);
                  }));
                  $(deleteBox).click(function(){
                    if(!$(this).hasClass('selected')){
                      $(this).addClass('selected');
                      var owner = $(this);

                      $(this).find('.cancel').unbind('click').bind('click',function(){
                        owner.removeClass('selected');
                        return false;
                      })

                      $(this).find('.confirm').unbind('click').bind('click',function(){
                        $(this).parent().addClass('loading');
                        var parent = $(this).parent();

                        //ajax to delete

                        setTimeout(function(){ //On success
                          parent.addClass('deleted');
                          setTimeout(function(){
                            owner.fadeOut(600);

                            //remove item deleted

                            setTimeout(function(){
                              owner.find('.deleted').removeClass('loading').removeClass('deleted');
                              owner.removeClass('selected');
                              owner.show();
                            },1000) 
                          },1000)
                        },1000)

                        return false;
                      })
                    }   
                    return false;
                  });
          })(jQuery);

答案 2 :(得分:0)

像这样使用

function popup(){
   //do your stuff here

}

你的js代码就像

Public Class Table

    'IF Chooce Shared Work In Inherits Only
    'IF Not Chooce Shared Work In Variant Only
    Public Shared RecordCount As Integer

End Class

Public Class Customer 
    Inherits Table

    Private Sub GetRecordCount_From_Inherits()

        MsgBox(RecordCount) ' Here View (RecordCount)

    End Sub

    Sub GetRecordCount_From_Variant()


        Dim x As New Table
        MsgBox(x.RecordCount) 'Here Not View (RecordCount)

    End Sub
End Class