Как установить действие на всплывающую строку когда на нее нажимаешь?

Question

[Rostyk Ice]

Есть всплывающая строка

var select = '<select name="select123" id="sf1" accesskey="ц" role="menu" style="border-width: 0px; background: url(images/opacity.png);"> \
<option value="" class="label">колір</option> \
<option value="30">йоф</option> \
<option value="1">бежевий</option> \
<option value="2">білий</option> \
<option value="3">голубий</option> \
<option value="4">жовтий</option> \
<option value="5">зелений</option> \
</select>';

Как сделать чтобы при нажатии на эту вспл. строку выполнялось действие :

$('[name="product_category[]"][value=5464]').prop('checked', false);
        $('[name="product_category[]"][value=5465]').prop('checked', false);
        $('[name="product_category[]"][value=5466]').prop('checked', false);
        $('[name="product_category[]"][value=5467]').prop('checked', false);
        $('[name="product_category[]"][value=5468]').prop('checked', false);
        $('[name="product_category[]"][value=5469]').prop('checked', false);
        $('[name="product_category[]"][value=5470]').prop('checked', false);
        $('[name="product_category[]"][value=5471]').prop('checked', false);
        $('[name="product_category[]"][value=5472]').prop('checked', false);
        $('[name="product_category[]"][value=5473]').prop('checked', false);
        $('[name="product_category[]"][value=5474]').prop('checked', false);
        $('[name="product_category[]"][value=5475]').prop('checked', false);
        $('[name="product_category[]"][value=5476]').prop('checked', false);
        $('[name="product_category[]"][value=5477]').prop('checked', false);
        $('[name="product_category[]"][value=5478]').prop('checked', false);
        $('[name="product_category[]"][value=5479]').prop('checked', false);
        $('[name="product_category[]"][value=5480]').prop('checked', false);
        $('[name="product_category[]"][value=5481]').prop('checked', false);
        $('[name="product_category[]"][value=5482]').prop('checked', false);

Answer 1

[rakro]

Если я правильно понял вы этот элемент вставляете в DOM динамически. Поэтому для обработки клика по нему вам нужно воспользоваться делегированием событий.

$("#wrap").delegate("#sf1", "click", function(e){
	// ваши действия
        });

где #wrap - тот элемент, в который вы вставляете свой select

Comments

[Rostyk Ice]

в body wrap ?
у меня скрипт в Tempermonkey.
вот полный код строки:

var select = '<select name="select123" id="sf1" accesskey="ц" role="menu" style="border-width: 0px; background: url(images/opacity.png);"> \
<option value="" class="label">колір</option> \
<option value="30">йоф</option> \
<option value="1">бежевий</option> \
<option value="2">білий</option> \
<option value="3">голубий</option> \
<option value="4">жовтий</option> \
<option value="5">зелений</option> \
<option value="6">коричневий</option> \
<option value="7">червоний</option> \
<option value="8">кремовий</option> \
<option value="9">мікс</option> \
<option value="10">оранжевий</option> \
<option value="11">розовий</option> \
<option value="12">світлий</option> \
<option value="13">сірий</option> \
<option value="14">синій</option> \
<option value="15">сиреневий</option> \
<option value="16">темний</option> \
<option value="17">фіолетовий</option> \
<option value="18">хром</option> \
<option value="19">чорний</option> \
</select>';
$('body').append($(select));
$('#sf1').css("position", "absolute").css("top", 129).css("left", 312);
$('#sf1').on('change', function() {
    val = $(this).val();
    
    if(val == 1) {
        $('[name="product_option[3][product_option_value][2][option_value_id]"]').val('5')
        $('[name="product_option[3][product_option_value][3][option_value_id]"]').val('5');   // 5464
        $('[name="product_category[]"][value=5464]').prop('checked', true);
    }
        else if(val == 2) {
        $('[name="product_option[3][product_option_value][2][option_value_id]"]').val('181');
        $('[name="product_option[3][product_option_value][3][option_value_id]"]').val('181');
        $('[name="product_category[]"][value=5465]').prop('checked', true);
    }
        else if(val == 3) {
            $('[name="product_option[3][product_option_value][2][option_value_id]"]').val
        $('[name="product_option[3][product_option_value][3][option_value_id]"]').val('240');
        $('[name="product_category[]"][value=5466]').prop('checked', true);
    }
        else if(val == 4) {
            $('[name="product_option[3][product_option_value][2][option_value_id]"]').val('134');
        $('[name="product_option[3][product_option_value][3][option_value_id]"]').val('134');
        $('[name="product_category[]"][value=5467]').prop('checked', true);
    }
        else if(val == 5) {
            $('[name="product_option[3][product_option_value][2][option_value_id]"]').val('26');
        $('[name="product_option[3][product_option_value][3][option_value_id]"]').val('26');
        $('[name="product_category[]"][value=5468]').prop('checked', true);
    }
        else if(val == 6) {
            $('[name="product_option[3][product_option_value][2][option_value_id]"]').val
        $('[name="product_option[3][product_option_value][3][option_value_id]"]').val('205');
        $('[name="product_category[]"][value=5469]').prop('checked', true);
    }
        else if(val == 7) {
            $('[name="product_option[3][product_option_value][2][option_value_id]"]').val('135');
        $('[name="product_option[3][product_option_value][3][option_value_id]"]').val('135');
        $('[name="product_category[]"][value=5470]').prop('checked', true);
    }
        else if(val == 8) {
            $('[name="product_option[3][product_option_value][2][option_value_id]"]').val('65');
        $('[name="product_option[3][product_option_value][3][option_value_id]"]').val('65');
        $('[name="product_category[]"][value=5471]').prop('checked', true);
    }
        else if(val == 9) {
            $('[name="product_option[3][product_option_value][2][option_value_id]"]').val('37');
        $('[name="product_option[3][product_option_value][3][option_value_id]"]').val('37');
        $('[name="product_category[]"][value=5472]').prop('checked', true);
    }
        else if(val == 10) {
            $('[name="product_option[3][product_option_value][2][option_value_id]"]').val('133');
        $('[name="product_option[3][product_option_value][3][option_value_id]"]').val('133');
        $('[name="product_category[]"][value=5473]').prop('checked', true);
    }
        else if(val == 11) {
            $('[name="product_option[3][product_option_value][2][option_value_id]"]').val('258');
        $('[name="product_option[3][product_option_value][3][option_value_id]"]').val('258');
        $('[name="product_category[]"][value=5474]').prop('checked', true);
    }
        else if(val == 12) {
            $('[name="product_option[3][product_option_value][2][option_value_id]"]').val('96');
        $('[name="product_option[3][product_option_value][3][option_value_id]"]').val('96');
        $('[name="product_category[]"][value=5475]').prop('checked', true);
    }
        else if(val == 13) {
            $('[name="product_option[3][product_option_value][2][option_value_id]"]').val('162');
        $('[name="product_option[3][product_option_value][3][option_value_id]"]').val('162');
        $('[name="product_category[]"][value=5476]').prop('checked', true);
    }
        else if(val == 14) {
            $('[name="product_option[3][product_option_value][2][option_value_id]"]').val('130');
        $('[name="product_option[3][product_option_value][3][option_value_id]"]').val('130');
        $('[name="product_category[]"][value=5482]').prop('checked', true);
    }
        else if(val == 15) {
            $('[name="product_option[3][product_option_value][2][option_value_id]"]').val('131');
        $('[name="product_option[3][product_option_value][3][option_value_id]"]').val('131');
        $('[name="product_category[]"][value=5477]').prop('checked', true);
    }
        else if(val == 16) {
            $('[name="product_option[3][product_option_value][2][option_value_id]"]').val
        $('[name="product_option[3][product_option_value][3][option_value_id]"]').val('129');
        $('[name="product_category[]"][value=5478]').prop('checked', true);
    }
        else if(val == 17) {
            $('[name="product_option[3][product_option_value][2][option_value_id]"]').val('13');
        $('[name="product_option[3][product_option_value][3][option_value_id]"]').val('13');
        $('[name="product_category[]"][value=5479]').prop('checked', true);
    }
        else if(val == 18) {
            $('[name="product_option[3][product_option_value][2][option_value_id]"]').val('1011');
        $('[name="product_option[3][product_option_value][3][option_value_id]"]').val('1011');
        $('[name="product_category[]"][value=5480]').prop('checked', true);
    }
        else if(val == 19) {
            $('[name="product_option[3][product_option_value][2][option_value_id]"]').val('307');
        $('[name="product_option[3][product_option_value][3][option_value_id]"]').val('307');
        $('[name="product_category[]"][value=5481]').prop('checked', true);
    }
        else if(val == 30) {
        $('[name="product_category[]"][value=5464]').prop('checked', false);
        $('[name="product_category[]"][value=5465]').prop('checked', false);
        $('[name="product_category[]"][value=5466]').prop('checked', false);
        $('[name="product_category[]"][value=5467]').prop('checked', false);
        $('[name="product_category[]"][value=5468]').prop('checked', false);
        $('[name="product_category[]"][value=5469]').prop('checked', false);
        $('[name="product_category[]"][value=5470]').prop('checked', false);
        $('[name="product_category[]"][value=5471]').prop('checked', false);
        $('[name="product_category[]"][value=5472]').prop('checked', false);
        $('[name="product_category[]"][value=5473]').prop('checked', false);
        $('[name="product_category[]"][value=5474]').prop('checked', false);
        $('[name="product_category[]"][value=5475]').prop('checked', false);
        $('[name="product_category[]"][value=5476]').prop('checked', false);
        $('[name="product_category[]"][value=5477]').prop('checked', false);
        $('[name="product_category[]"][value=5478]').prop('checked', false);
        $('[name="product_category[]"][value=5479]').prop('checked', false);
        $('[name="product_category[]"][value=5480]').prop('checked', false);
        $('[name="product_category[]"][value=5481]').prop('checked', false);
        $('[name="product_category[]"][value=5482]').prop('checked', false);
    }
});

[rakro]

Rostyk Ice: замените #wrap на body

[Rostyk Ice]

rakro: Спасибо, работает!