Question

How to prevent mixing values in jquery if i use $(this)? For example:

1: <input type="text" id="in1" class="test"> <br />
2: <input type="text" id="in2" class="test"> <br />

<div id="ppp"> <p class="show" id="one">onevalue</p> <p class="show" id="two">twovalue</p></div>

#ppp {
    display: none;
}

$(".click").click(function(e) {

    $("#block").show();

    var current = $(this);

    $(".show").click(function(e) {
        current.val($(this).attr("id"));
    });
});

live example – http://jsfiddle.net/VmXU9/59/

If i clicked in 1 input show me “onevalue” and “twovalue”. If i clicked “onevalue” or “twovalue” that in 1 input appears id of “onevalue” or “twovalue”. This is good, but if i additionally clickes 2 input and choose “onevalue” or “twovalue” that ID of “onevalue” or “twovalue” appears in 1 input and 2 intput. Should be only in one – in last clicked. How can i it make?

Thanks!

Answer 1

If I understand what you’re trying to do, you need to:

1. Move the scope of current
2. Move the binding of the click event on input.show elements to outside the click of input.click elements:

Demo: http://jsfiddle.net/JAAulde/VmXU9/65/

Ideally, you’d close the scope over all of this to avoid introducing current as global, and you’d check that current had been changed from its initial setting before operating on it:

Demo: http://jsfiddle.net/JAAulde/VmXU9/66/