jQuery - 取消下拉确认对话框上的更改事件

我有一个下拉菜单，我有jQuery“更改”功能。jQuery - 取消下拉确认对话框上的更改事件

我想根据确认对话框实现所选项目的更改。

如果确认为真，我可以继续进行选定的更改，否则我会将现有项目保留为选定状态并取消更改事件。

我该如何实现这与jQuery ...... ????

jQuery函数

<script type="text/javascript"> 
    $(function() { 

     $("#dropdown").change(function() { 

       var success = confirm('Are you sure want to change the Dropdown ????'); 

        if (success == true) { 
         alert('Changed'); 

// do something     
        } 
        else { 

         alert('Not changed'); 

         // Cancel the change event and keep the selected element 
        } 
     }); 
    }); 

</script>

注意：有一点要记住“变”功能命中后，才选定的项目改变所以最好还是想实现这个关于“平变化” - 但它不提供jQuery和有没有什么方法来实现这个？

任何帮助将不胜感激...

Vinu

来源

2011-07-13 Vinu

这看起来比使用全局变量的更好方法。 http://stackoverflow.com/a/3963959/47167 – EdenMachine

喜欢的东西我做了什么吗？

http://jsfiddle.net/Swader/gbdMT/

只需尽快将该值保存为一个用户点击选择框，并恢复到这个值，如果平变化确认返回false。

这里是我的小提琴代码：

var lastValue; 

$("#changer").bind("click", function(e) { 
    lastValue = $(this).val(); 
}).bind("change", function(e) { 
    changeConfirmation = confirm("Really?"); 
    if (changeConfirmation) { 
     // Proceed as planned 
    } else { 
     $(this).val(lastValue); 
    } 
});

来源

2011-07-13 11:01:52 Swader

海Swader，我的工作......并非常感谢你的帮助:) – Vinu

@Vinu没问题，很高兴我可以帮助。如果它解决了您的问题，不要忘记标记答案是正确的！祝你好运！ – Swader

嗯，Vinu正确地指出，只有一次选择的价值实际上已经改变了触发jQuery的change事件。你会更好做这样的事情：

var prev_val; 

$('#dropdown').focus(function() { 
    prev_val = $(this).val(); 
}).change(function() { 
    $(this).blur() // Firefox fix as suggested by AgDude 
    var success = confirm('Are you sure you want to change the Dropdown?'); 
    if(success) 
    { 
     alert('changed'); 
     // Other changed code would be here... 
    } 
    else 
    { 
     $(this).val(prev_val); 
     alert('unchanged'); 
     return false; 
    } 
});

来源

2011-07-13 11:06:27 BenM

这几乎就是我在我的答案中所做的。 – Swader

是的，我知道，但是当你发布你的时候，我正在发布我的信息。直到我刷新页面，我才看到它... – BenM

Upvoting这一个。如果用户使用Tab来浏览页面，那么它也可以工作。 –

使用下面的代码，我已经测试它和它的工作

var prev_val; 
$('.dropdown').focus(function() { 
    prev_val = $(this).val(); 
}).change(function(){ 
      $(this).unbind('focus'); 
      var conf = confirm('Are you sure want to change status ?'); 

      if(conf == true){ 
       //your code 
      } 
      else{ 
       $(this).val(prev_val); 
       $(this).bind('focus'); 
       return false; 
      } 
});

来源

2013-08-26 13:24:41

绑定已被折旧使用$（this）.focus（）代替''中设置新的'prev_val'。 – lostmylogin

-1

模糊，对焦和存储先前值似乎有点麻烦。我被附上我的听众不要选择解决了这个问题，但到了选择：

$("#id").on('mousedown','option',confirmChange);

然后，

function confirmChange(e){ 
    var value = $(this).val(), 
     c = confirm('Are you sure you want to change?'); 

    if(c) 
     $(this).parent().val(value);//can trigger .change() here too if necessary 
    else 
     e.preventDefault(); 
}

当然优化可以做，但这是一般的想法。

来源

2013-10-29 21:55:33 Pickle

是的，很好，但只是想注意到这种情况，您可以通过代码动态改变选择。 –

下面的代码是为单选按钮实现的。我认为这个代码稍作修改也可以用于下拉菜单。

 <input type="radio" class="selected" value="test1" name="test1" 
     checked="checked" /><label>test1</label> 

     <input type="radio" name="test1" value="test2" /><label> 
     test2</label> 

     <input type="radio" name="test1" value="test3" /><label> 
     test3</label> 

</div> 

$("input[name='test1']").change(function() { 
     var response = confirm("do you want to perform selection change"); 
     if (response) { 
      var container = $(this).closest("div.selection"); 
      //console.log(container); 
      //console.log("old sel =>" + $(container).find(".selected").val()); 
      $(container).find(".selected").removeClass("selected"); 
      $(this).addClass("selected"); 
      //console.log($(this).val()); 
      console.log("new sel =>" + $(container).find(".selected").val()); 
     } 
     else { 
      var container = $(this).closest("div.selection"); 
      $(this).prop("checked", false); 
      $(container).find(".selected").prop("checked", true); 
     } 
    });

来源

2014-06-28 08:21:52 Tjcool

jQuery - 取消下拉确认对话框上的更改事件

回答

相关问题