Question

我正在使用名为jQquery.confirm的第三方jQuery库。它在jQuery中提供对话框。单击特定类的按钮后，我想使用<ComponentGroup Id="CG_Group1" Directory="!(wix.FOLDERIDTOUSE)" Source="$(var.FilesLocation)"> <Component Id="C_Group1_file1.file"> <File Name="Group1_file1.file" Id="FI_Group1_file1.file" /> </Component> </ComponentGroup>函数来显示确认信息：

<Directory Id="FOLDERSPECIFICTOTHISPROJECT" Name="MyFolder/>
<WixVariable Id="FOLDERIDTOUSE" Value="FOLDERSPECIFICTOTHISPROJECT"/>

我遇到的问题是confirm()。我想简单地点击这里点击按钮。我试过这个，但它似乎没有识别出我需要点击的按钮：

$(".btn-danger").click(function(event) {
    //Prevent the button from being clicked.
    event.preventDefault();

    $.confirm({
        text: "Are you sure you want to delete that comment?",
        confirm: function() {
            //Code in here for button to be pressed
        }
    });
});

我猜我需要把它作为参数传递给某个地方？

Answer 1

在confirm处理程序函数中，this的范围不会引用被单击的按钮。要解决此问题，您需要在confirm处理程序之外的变量中存储对单击按钮的引用。

但请注意，您创建的逻辑将以循环结束;您点击该按钮，显示confirm，然后再以编程方式再次点击该按钮，这将再次显示confirm等等无限广告。我建议您调用函数来执行confirm操作中所需的操作，如下所示：试试这个：

$(".btn-danger").click(function(e) {
    e.preventDefault();

    $.confirm({
        text: "Are you sure you want to delete that comment?",
        confirm: function() {
            actionWasConfirmed();
        }
    });
});

var actionWasConfirmed = function() {
    console.log('do something here...');
};

Answer 2

按钮的HTML代码：

<button class="btn-danger" >Delete</button>

和 Javascript函数

$(".btn-danger").click(function(){
if(confirm("Are you sure you want to delete that comment?")){
   //Code in here for button to be pressed
  }
 });

Answer 3

每个事件回调函数都会接收对触发它的事件的引用。您已经设置为使用event参数获取该引用。通过该对象，您可以引用触发事件的对象（在您的情况下是按钮）。所以，你可以这样做：

$(".btn-danger").click(function(event) {

  //Prevent the button from being clicked.
  event.preventDefault();

  $.confirm({
    text: "Are you sure you want to delete that comment?",
    confirm: function() {
        event.target.trigger("click")"
    }
  });
});

但是，正如已经指出的那样，点击该按钮会在确认后再次点击该按钮。

由于您只想在确认时删除某些内容，因此更好的方法是删除该条目。换句话说，分开你的逻辑。按钮单击应触发确认，确认应删除该条目，而不是再次单击该按钮。

$(".btn-danger").click(function(event) {

  //Prevent the button from being clicked.
  event.preventDefault();

  $.confirm({
    text: "Are you sure you want to delete that comment?",
    confirm: function() {
        // Delete the comment here, don't click more buttons.
    }
  });
});

Answer 4

使用array:3 [ "b" => "green" 0 => "yellow" 1 => "red" ]时，必须确保在正确的对象中使用它。您无法在$（确认）中使用$(this)并期望引用您的$(this)。相反，它将引用$(".btn-danger")而不是您的目标按钮。

看看下面的工作示例，并询问是否有任何不清楚的地方。

$(confirm)

我不确定这是否是您想要做的，但请考虑上面的代码是一种无限循环，因为当触发点击时，将再次调用整个代码。因此，如果您想按另一个按钮，请使用它的完整选择器，或为其分配一个唯一ID并选择它，如下所示：

目标按钮的HTML代码：

$(".btn-danger").click(function(e) {
    e.preventDefault();
    // Here $(this) references the object you need clicked
    var currentButton = $(this);
    $.confirm({
        text: "Are you sure you want to delete that comment?",
        confirm: function() {
            // If you used $(this) here you referenced to your $(confirm) object

            // Instead of a false $(this), use the button that actually triggered this code.
            currentButton.trigger('click');
        }
    });
});

更新了按此按钮的jQuery代码

<input type="button" value="Button To Be Clicked after Confirm" name="myButton" id="uniqueID_onWholePage" />

Answer 5

这是一个使用SweetAlert的示例，它是Javascript内置警报弹出窗口的替代品。如果您之前没有查看过SweetAlert，我强烈建议您这样做。 It also integrates very well with Bootstrap。

这是一个工作示例（您可能希望全屏显示完整效果）。不幸的是，您将无法看到实际的提交工作，但是一旦您添加实际操作，代码就可以正常工作。

$("form.confirm").find("[type=submit]").click(function(e) {
  var $this;
  e.preventDefault();
  $this = $(this);
  return sweetAlert({
    title: "Are you sure?",
    type: "warning",
    showCancelButton: true,
    confirmButtonColor: "#DD6B55",
    confirmButtonText: "Confirm Delete",
    closeOnConfirm: false
  }, function() {
    return $this.closest("form").submit();
  });
});

<link href="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.3/sweetalert.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.3/sweetalert.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<form class="confirm" method="POST" action"">
  <button type="submit">Submit</button>  
</form>

如何将按钮传递给Jquery函数？

5 个答案: