Остановить все события элемента

Question

Я хочу остановить все события ввода, выбрать, textarea. Если есть событие при щелчке или в фокусе окна ввода, то оно не должно работать. Когда я нажимаю на поле ввода, событие не должно запускаться. Не должно быть фокуса на входном или текстовом поле. Если я нажимаю на select, то он не должен открываться (не отключать его, использовать preventDefault()), и мне также нужна кнопка, при нажатии этой кнопки события, которые мы остановили, должны снова работать.

First: 
<input class='test1' type='text' value='1' /></br></br> 

Second: 
<select class='test2'> 
    <option>1</option> 
    <option>2</option> 
    <option>3</option> 
</select></br></br> 

Third: 
<textarea class='test3'>Hi all</textarea></br></br> 

Fourth: 
<input class='test4' type='text' value='4' /> 

$(".test1").on("click", function (e) { 
    alert('click on test1'); 
}); 

$(".test2").on("click", function (e) { 
    alert('click on test2'); 
}); 

$(".test3").on("click", function (e) { 
    alert('click on test3'); 
}); 

$(".test4").on("click", function (e) { 
    alert('click on test4'); 
}); 

$("input").on("click", function (e) { 
    alert('click on input'); 
}); 

$("input").bind("click", function (e) { 
    alert('click on input (bind)'); 
}); 

$("input").hover(function (e) { 
    alert('hover on input'); 
}); 

$("input").on("focus", function (e) { 
    alert('focus on input'); 
}); 

Fiddle

Answer 1

вы могли бы использовать как этот коснуться

var enabled = false; 
$('input, textarea, select ').on('mousedown click focus', function(e) { 
    if(!enabled){ 
     e.preventDefault(); 
     this.blur(); 
     window.focus(); 
    } 
}); 
$("#enable-btn").on("click", function(e){ 
    enabled = !enabled; 
    var text = $(this).val(); 
    $(this).val(text == "Enable" ? "Disable" : "Enable"); 
}); 

JsFiddle example

---

Edit после комментария

Чтобы предотвратить другие функции, связанные с событиями, вам необходимо проверить, отключено ли состояние. У вас есть обновленный пример.

HTML

<input type="text" id="id1" /> 
<select> 
    <option val="0">Val 0</option> 
    <option val="1">Val 1</option> 
    <option val="2">Val 2</option> 
</select> 
<textarea rows="4" cols="50"></textarea> 
<input type="button" id="enable-btn" value="Enable" /> 
<div id="log"></div> 

SCRIPT

var enabled = false; 
$('input, textarea, select ').on('mousedown click focus', function(e) { 
    if(!enabled){ 
     e.preventDefault(); 
     this.blur(); 
     window.focus(); 
    } 
}); 
$("#enable-btn").on("click", function(e){ 
    enabled = !enabled; 
    var text = $(this).val(); 
    $(this).val(text == "Enable" ? "Disable" : "Enable"); 
}); 

$("select").on("click",function(e){ 
    if (!enabled){  
     e.preventDefault(); 
     return false; 
    } 
    $("#log").html("Select clicked");  
}); 
$("input").on("click",function(e){ 
    if (!enabled){  
     e.preventDefault(); 
     return false; 
    } 
    $("#log").html("Input clicked");  
}); 

Updated JsFiddle demo