满足某个条件时停止功能,并在其他条件下再次启动

时间:2016-02-03 06:51:59

标签: javascript jquery return

我有一个复选框(有点开关按钮)来打开/关闭功能。当我打开它时,功能应该工作,当我关闭它时,该功能不起作用。

现在的问题是当我打开开关,运行功能并将其关闭,该功能仍然有效,并没有停止。当开关关闭时,我需要停止工作。我也提出了fiddle问题。

HTML结构:

{
"data": [
    {
    "source" : <source_url1>,
    "created_time" : <created_time1>,
    "id" : <photo_id1>
    },
   {
    "source" : <source_url2>,
    "created_time" : <created_time2>,
    "id" : <photo_id2>
   }
]
}



JS:

<label for="onoffswitch">Switch: </label>
<input type="checkbox" name="onoffswitch" class="onoffswitch-checkbox" id="mathswitch">
<br><br>
<textarea name="question1" id="question1" class="question_aptitude maths_editor"></textarea>
<br><br>
<div id="result"></div>



我已经开始搜索停止某个函数,并且大多数人都说使用了var isMaths=0; $(function(){ $("#mathswitch").on('click', function(e){ chk= $("#mathswitch:checked").length; if (chk>0) { isMaths=1; } else { isMaths=0; } e.stopImmediatePropagation(); }) $(".maths_editor").focus(function(){ store_id= $(this).prop('id'); console.log("chk :" + chk); if (isMaths=='1') { myfunction(); } else { $('#'+store_id).on('keyup', function (e){ var key = e.keyCode; if (key == 77 && e.altKey) { alert("Maths is turned OFF"); e.stopImmediatePropagation(); return; } if (key == 90 && e.altKey) { alert("Maths is turned OFF"); e.stopImmediatePropagation(); return; } }) } }) }) function myfunction() { $("#result").text("Maths is ON!"); console.log("working!"); $('#'+store_id).on('keyup', function (e){ var key = e.keyCode; if (key == 77 && e.altKey) { alert("Maths is turned ON"); e.stopImmediatePropagation(); return; } if (key == 90 && e.altKey) { alert("Maths is turned ON"); e.stopImmediatePropagation(); return; } }) } ,但这似乎不适用于我的情况。

2 个答案:

答案 0 :(得分:2)

我修改了您的javascript以获得我认为您想要的功能enter image description here

主要问题是,每当编辑器关注或myFunction运行时,您都在添加一个keyup事件,并且您还尝试在无法记录的范围内记录chk变量。我的修改改变了你想要“打开或关闭功能”的核心方面,但我觉得它可能适用于你需要的东西。如果您需要我解释任何事情,请随时发表评论!

以下是代码:

var isMaths = false;

$(function() {
    $("#mathswitch").on('click', function(e) {
        isMaths = $("#mathswitch").prop('checked');

        e.stopImmediatePropagation();
    })

    $('.maths_editor').on('keyup', myfunction);
})

function myfunction(e) {
    var key = e.keyCode;

    if (isMaths) {
        $("#result").text("Maths is ON!");
        console.log("working!");

        // Here is where you would call the function that's in an
        // external file as you said in the comments on your question.
        externalFileFunctionCall();

        if (key == 77 && e.altKey) {
            alert("Maths is turned ON");
            e.stopImmediatePropagation();
            return;
        }
        if (key == 90 && e.altKey) {
            alert("Maths is turned ON");
            e.stopImmediatePropagation();
            return;
        }
    } else {
        $("#result").text("Maths is OFF!");

        if (key == 77 && e.altKey) {
            alert("Maths is turned OFF");
            e.stopImmediatePropagation();
            return;
        }
        if (key == 90 && e.altKey) {
            alert("Maths is turned OFF");
            e.stopImmediatePropagation();
            return;
        }
    }
}

答案 1 :(得分:1)

您可以使用jQuery .off()删除keyup事件处理程序,并根据复选框在焦点上声明一个新的处理程序。 See the documentation

$(function(){
    $(".maths_editor").focus(function(){
    	$(this).off("keyup");
        store_id= $(this).prop('id');
        if ($("#mathswitch").is(":checked"))
        {
           myfunction();
        }
        else
        {
          $('#'+store_id).on('keyup', function (e){
            var key = e.keyCode;
            if (key == 77 && e.altKey)
            {
                alert("Maths is turned OFF");
                e.stopImmediatePropagation();
                return;
            }
            if (key == 90 && e.altKey)
            {
                alert("Maths is turned OFF");
                e.stopImmediatePropagation();
                return;
            }
          });
        }
    });
});

function myfunction() {
  $('#'+store_id).on('keyup', function (e){
    var key = e.keyCode;
    if (key == 77 && e.altKey)
    {
        alert("Maths is turned ON");
        e.stopImmediatePropagation();
        return;
    }
    if (key == 90 && e.altKey)
    {
        alert("Maths is turned ON");
        e.stopImmediatePropagation();
        return;
    }
  });
}
.case{
  width: 40%;
  float: right;
  border: 1px solid;
  padding: 0.5em;
  text-align: center;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="case">
<h3>
Cases
</h3>
Please use CONSOLE to see values<br><br>
Case1: Initially without checking the checkbox and typing in the textbox, Pressing Alt+M should give alert ""Maths is OFF" but its not doing so!!<br><br>
Case2: After going through Case1, now check the checkbox and press Alt+M in texbox. It works fine. Now uncheck the checkbox and type Alt+m again. I still get the alert "Maths is ON" whereas i'm expecting it not to work because IF statement is false now!
</div>
<label for="onoffswitch">Switch: </label>
<input type="checkbox" name="onoffswitch" class="onoffswitch-checkbox" id="mathswitch">
<br><br>
<textarea name="question1" id="question1" class="question_aptitude maths_editor" wrap="hard"></textarea>
<br><br>
<div id="result">

</div>