如何jquery提醒确认框"是"和"否"

Question

有人知道如何让jQuery与我的HTML和CSS一起使用.当我点击按钮并打开中心的警告框时,我需要一些文本和选项"是","否",当点击是以删除文本时？我的代码在这里:

<div class="text">Some text here 
    <a href="#" class="deleteMe">
        <span class="delete-icon"> x Delete </span>
    </a>
</div>

DEMO

Answer 1

请参阅以下代码段:

$(document).on("click", "a.deleteText", function() {
    if (confirm('Are you sure ?')) {
        $(this).prev('span.text').remove();
    }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="container">
    <span class="text">some text</span>
    <a href="#" class="deleteText"><span class="delete-icon"> x Delete </span></a>
</div>

Answer 2

我不会编写您的代码,但您要查找的内容类似于jquery对话框

看看这里

jQuery模态确认

$(function() {
    $( "#dialog-confirm" ).dialog({
      resizable: false,
      height:140,
      modal: true,
      buttons: {
        "Delete all items": function() {
          $( this ).dialog( "close" );
        },
        Cancel: function() {
          $( this ).dialog( "close" );
        }
      }
    });
  });

<div id="dialog-confirm" title="Empty the recycle bin?">
  <p>
    <span class="ui-icon ui-icon-alert" style="float:left; margin:0 7px 20px 0;"></span>
    These items will be permanently deleted and cannot be recovered. Are you sure?
  </p>
</div>

Answer 3

这个插件可以帮到你,

craftpip/jQuery的确认

它易于设置,并具有一系列功能.

$.confirm({
    title: 'Confirm!',
    content: 'Simple confirm!',
    buttons: {
        confirm: function () {
            $.alert('Confirmed!');
        },
        cancel: function () {
            $.alert('Canceled!');
        },
        somethingElse: {
            text: 'Something else',
            btnClass: 'btn-blue',
            keys: ['enter', 'shift'], // trigger when enter or shift is pressed
            action: function(){
                $.alert('Something else?');
            }
        }
    }
});

除此之外,您还可以从远程网址加载内容.

$.confirm({
    content: 'url:hugedata.html' // location of your hugedata.html.
});