jQuery调用单击单选按钮而不会导致更改事件

时间:2017-11-22 16:43:23

标签: javascript jquery html

单击事件会触发jQuery中的更改事件。有没有办法解决?我有一个单选按钮,单击时,在另一组单选按钮中的另一个单选按钮上调用单击事件。但我只想要点击的第一个单选按钮通过我的“更改”功能。为简化起见,目前选择1A和2A。如果将2A更改为2B,则应在input[menu2]上调用更改函数。我想要做的是如果您将1A更改为1B,则应在input[menu1]上调用更改函数,但不应在input[menu2]上调用。

$(document).ready(function() {

  $("#1A").on("click", function() {
    $("#2A").click();
  });

  $("#1B").on("click", function() {
    $("#2B").click();
  });

// The problem is here...if menu1 is clicked, then menu2 is also clicked so this is called twice. I want it so that when menu1 is clicked, menu2's click does not hit this function.
  $("input[name='menu1'], input[name='menu2']").on("change", function() {
    // Confirmation modal appears...
    if (user.confirmChange = true) {
      // Keep things the way they are...
    } else {
      // Put things back to their original settings.
    }

  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="menu1">
  <input type="radio" name="menu1opt" value="menu1OptA" id="1A" checked>Menu 1 Option A />
  <input type="radio" name="menu1opt" value="menu1OptB" id="1B">Menu 1 Option B />
</div>

<div id="menu2">
  <input type="radio" name="menu2opt" value="menu2OptA" id="2A" checked>Menu 2 Option A />
  <input type="radio" name="menu2opt" value="menu2OptB" id="2B">Menu 2 Option B />
</div>

2 个答案:

答案 0 :(得分:0)

将选中的属性设置为true将导致在不执行更改事件的情况下选择它。

((AuthenticationActivity)getActivity()).login(email.getText().toString(), password.getText().toString());
var text = "foo bar <sum>(10+33)/pi</sum> baz";
var matches = text.match(/<sum>[\s\S]+?<\/sum>/g);
matches.forEach(element => {
    var result = evaluateSum(element);
    // Now somehow replace element with result
});
$(document).ready(function() {

  $("#1A").on("click", function() {
    $("#2A").prop('checked', true);
  });

  $("#1B").on("click", function() {
    $("#2B").prop('checked', true);
  });

// The problem is here...if menu1 is clicked, then menu2 is also clicked so this is called twice. I want it so that when menu1 is clicked, menu2's click does not hit this function.
  $("input[name='menu1'], input[name='menu2']").on("change", function() {
    console.log('change');
    /* Confirmation modal appears...
    if (user.confirmChange = true) {
      // Keep things the way they are...
    } else {
      // Put things back to their original settings.
    }*/

  });
});

答案 1 :(得分:0)

你尝试过这样的事吗?

col_names=[1,2,3,4,5,6,7,8,9,10,11,12,13] #for visualization
bars=[4,0,2,0,1,0,4,0,5,0,3,0,1]

pd.DataFrame(dict(zip(col_names,bars)),index=range(1)).plot(kind='bar')   # Plotting bars

def measure_water(l):
    water=0
    for i in range(len(l)-1):   # iterate over bars (list)
        if i==0:                # case to avoid max(:i) situation in case no item on left
            pass
        else:
            vol_at_curr_bar=min(max(l[:i]),max(l[i:]))-l[i]   #select min of max heighted bar on both side and minus current height
            if vol_at_curr_bar>0:   # case to aviod any negative sum
                water+=vol_at_curr_bar
    return water

measure_water(bars)
$(document).ready(function() {

  $("#1A").on("click", function() {
    $("#2A").click();
  });

  $("#1B").on("click", function() {
    $("#2B").click();
  });

// The problem is here...if menu1 is clicked, then menu2 is also clicked so this is called twice. I want it so that when menu1 is clicked, menu2's click does not hit this function.
  $("#menu1 input").on("change", function() {
  alert('CHANGE!!');
    // Confirmation modal appears...
    if (user.confirmChange = true) {
      // Keep things the way they are...
    } else {
      // Put things back to their original settings.
    }

  });
});