передать выбранный элемент как переменную в другую функцию jquery

Question

Код ниже предполагает, что элемент, по которому мы щелкаем, является элементом div.Что если выбранный элемент неизвестен, и мы хотим получить тип элемента и идентификатор, а затем передать его в функцию select change (), чтобы изменить его цвет.Каков наилучший способ сделать это.

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.7/themes/base/jquery-ui.css" type="text/css" media="all" /> 
  <script src="http://code.jquery.com/jquery-1.4.4.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.7/jquery-ui.min.js" type="text/javascript"></script> 

<style>
    .aaa { width:100px; height:100px;background-color:#ccc;margin-bottom:5px;}
    p{widht:500px; height:500px; margin:0px; padding:0px;border:2px solid red;color:#000;}
</style>

<select id="item_select" name="item">
    <option value="1">red</option>
    <option value="2">blue</option>
    <option value="3">green</option>
</select>

<button>Click to create divs</button>
<p id="ptest"></p>

<script type="text/javascript">
var dividcount = 1;

$("button").click(function() {
    var myDiv = $('<div id=lar' + dividcount + ' class=aaa></div>');
    $(myDiv).appendTo('#ptest');

    dividcount++;
});

$('div').live('click', function() {

    $('div').removeClass('selected');
    $('div').html('');

    $(this).addClass('selected');
    $(this).html('div #' + this.id);
});

$('select').change(function() {
    $('div').each(function() {
        if ($(this).hasClass('selected')) {
            var str = $("select option:selected").text();
            $(this).css("background-color", str);
        }
    });
});
</script>

Answer 1

Событие связывается с div элементами, поэтому оно не будет запущено, если вы нажмете на любой другой элемент. Но я могу предпочесть использовать функцию делегата.

var $ptest = $('#ptest');
$($ptest).delegate("div", 'click', function() {

    $('div', $ptest).removeClass('selected');
    $('div', $ptest).html('');

    $(this).addClass('selected');
    $(this).html('div #' + this.id);
});

Это ограничивает события щелчка элементами div, созданными внутри элемента #ptest. и $('div', $ptest).html(''); гарантирует, что операция извлечения не затрагивает div вне #ptest.

Вы можете увидеть рабочий образец в этой скрипке .