Как отключить функцию Javascript, когда включена другая?

Question

У меня есть эта функция:

$(document).ready(function(){   
    function Fos(buttonSel, inputSel, someValue, cssProperty) {
        $(buttonSel).click(function(){   
            var value = $(inputSel).attr("value");
            $("div.editable").click(function (e) { 

                e.stopPropagation();

                showUser(value, someValue, this.id)
                var css_obj={};
                css_obj[cssProperty]=value;
                $(this).css(css_obj);  
            });        
        });        
    }   

Вот три места, где записывается функция:

Fos('#border_button', '#border-radius', 2, '-webkit-border-radius');
Fos('#background_color_button', '#background-color', 1, 'background-color');
Fos('#opacity_button', '#opacity', 3, 'opacity');

---

<input type="text" id="border-radius" value="20px">
<div id="border_button">BORDER RADIUS</div>
<input type="text" id="background-color" value="red">
<div id="background_color_button">Background</div>
<input type="text" id="opacity" value=".5">
<div id="opacity_button">Opacity</div> 

---

<div id="2" class="defaultclass editable" style="<?php getStyle('2') ?>">
    something
</div>

Когда вы щелкаете по DIV с ID = "border_button", или "background_color_button", или "opacity_button" он ждет, пока вы нажмете любой DIV с class = "editable", ... $ ("div.editable"). click (function (e) {... он выполняет функцию с этими параметрами.

Мне просто нужно исправление, которое позволит только ОДНОЙ функции с включенными параметрами одновременно.

В настоящее время, когда вы щелкаете по всем трем элементам div с ID = "border_button", или "background_color_button", или "opacity_button" И ТОГДА на элементе div с class = "editable", он выполняет функцию со ВСЕМ ТРИ ТРЕХ наборов параметров .

Это плохо. Я не могу понять это.

С уважением,

* 1023 Тэйлора *

Answer 1

Вы не можете «отключить» функцию, но вы можете установить переменную, которая заставит ее сразу выйти:

 var stopMe = true

 function myFunction() {

   if(stopMe) {

      return;

   } 

  ...

 }

Answer 2

Это может быть возможным решением:

• Иметь глобальную переменную (или скрытый ввод HTML), скажем, lastDivClicked, для хранения идентификатора недавно нажатого div
• Обновить lastDivClickedкаждый раз при нажатии одного из этих трех элементов div

• меняйте свою функцию следующим образом:

  функция Fos (inputSel, someValue, cssProperty) {

    var buttonSel = $('#lastDivClicked').val();
    $(buttonSel).click(function(){ ... }
  

  }

Answer 3

Вы, кажется, связываете и связываете одни и те же функции снова и снова, поэтому, вероятно, у вас есть e.stopEventPropagation там. Попробуйте назначить события один раз, а затем управлять текущим состоянием (какая кнопка активна) и идти оттуда:

var $currentInput = null;

$("#border_button,#background_color_button,#opacity_button").click(function() {
    if ($currentInput == null) {
        $currentInput = $(this).prev();
    }
});

$("div.editable").click(function(e) {
    if ($currentInput == null)
        return;

    $(this).css(GetCssProperties());
    showUser($currentInput.val(), /* where does someValue come from? */, this.id)
    $currentInput = null;
});

function GetCssProperties() {
    if ($currentInput == null) return null;

    var value = $currentInput.val();

    if ($currentInput.attr("id") == "border-radius") return {
        "-webkit-border-radius": value
    }
    if ($currentInput.attr("id") == "background-color") return {
        "background-color": value
    }
    if ($currentInput.attr("id") == "opacity") return {
        "opacity": value
    }
}

---

рабочий пример здесь: http://jsfiddle.net/HUJ5A/

Answer 4

Не могу сказать все по вашему вопросу.Но эта часть $("div.editable").click(function (e) { будет связывать несколько событий щелчка с div.editable каждый раз, когда пользователь нажимает Foo arugments[0] или buttonSel.

Answer 5

Запустить функцию для тега с определенным классом.И в конце функции удалите этот класс из тега.

jQuery(".myclass").click(function(){
/* do something */ 
jQuery(this).removeClass('myclass');

});