Jquery - 动态地将参数传递给函数

Question

I'm not even sure I'm asking or going about this the right way but it's probably easier if I just show it. Basically, I'm trying to have run an attr of each div as a parameter through a function and have it return a different result based on that div's attr.

The example, as you can see, is a group of dropdowns that appear when you click on a link in the container div. If you make a selection it saves that as a attr in the parent div. The problem arises when you click out, then back in on the container ... instead of reshowing each dropdown with the appropriate default or selection showing, it just mirrors the result of the a next to it.

http://jsfiddle.net/nosfan1019/b7F6x/5/

TIA

Answer 1

I inserted some console.log() statements to see what was happening with your various jQuery selectors. I observe the following:

• when I click in the first "click" node, _container is "top one"
• thus in your iteration of the three divs, you select both divs with class 'dd' contained in the div with class 'top one'
• the parameters _attr and _parent that you pass to your function select() are the same for each node that is processed, giving the same result for both 'dd' boxes.

I think you want to change the selectors you use to locate the nodes to modify.

Answer 2

foo = foo.find('.dropdown-toggle').html(_new + '<b class="caret"></b>');

with this line you get two divs and hence you've change both values(in case the value was chosen from the droplist).

To restore selected values correctly:

function modified(_select) {
    console.log("modify");
    foo = $('#box').html();
    foo = $(_select).html(foo);
    // iterate on collection to restore selected value from selection tag;
    foo.filter("div[selection]").each(function(i, v){
        var selected = $(v).attr('selection');
        $(v).find('.dropdown-toggle').html(selected + '<b class="caret"></b>');                
    });                
}

Then, it's needed to be checked if any of parentDiv has [selection] attr:

if($(y).filter("div[selection]").length > 0){
    return modified(y);
}         

http://jsfiddle.net/b7F6x/50/