Question

我有一个函数，当用户输入内容时会显示div，但它会干扰我输入的页面。我希望在包含保存输入的div的页面部分可见时禁用脚本，这样当用户在输入中输入时，.editPro不会显示（）。

HTML

<div class="green" style="width:100%;height:100%;position: fixed;display:none;background:green;">
    <input type='text' />
</div>
<div class="editPro" style="width:100%;height:100%;position: fixed;display:none;background:red;"></div>
<div id='edit'>edit</div>

JAVASCRIPT

 $('#edit').click(function (event) {
     $(".green").show("slow");

 });

 $(document).keypress(function (event) {
     $(".editPro").show("slow");
 });

这里有Fiddle来说明问题

Answer 1

我不确定我是否正确理解了这个问题，但也许这就是你要找的东西（当你在<input/>内输入时，它会阻止红色div出现）：

$('input').keypress(function (event) {
     event.stopPropagation();
 });

http://jsfiddle.net/Un8yv/1/

Answer 2

http://jsbin.com/ipIPURav/1/

检查此网址，您只需检查您的课程是否可见

Answer 3

我已对代码进行了一些更改，希望这有助于

试试这个FIDDLE

http://jsfiddle.net/venkat_asman/Un8yv/2/
<div class="green" style="width:100%;height:100%;position: fixed;display:none;background:green;z-index:100;">
</div>
<div class="editPro" style="width:100%;height:100%;position:fixed;display:none;background:red;z-index:100;"></div>
<div id='edit'>edit</div>
  <input style="z-index:1000;display:none;position:fixed;" type='text' />

和JS是

    $('#edit').click(function(event){
    $(".green").show("slow");
    $("input").show();
   $('#edit').hide();

});

 $(document).keypress(function(event){
    $(".editPro").show("slow");
});

Answer 4

只需检查目标节点即可。如果它不是输入，则执行脚本

 $(document).keypress(function (event) {
    if(event.target.nodeName !== "INPUT"){
       $(".editPro").show("slow");
    }
 });

Fiddle

禁用javascript功能

4 个答案: