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 - 取消下拉確認對話框上的更改事件

回答

相關問題