Question

我选择了一些内容生成的选项：

  <select style="color: #444;">
<?php

$select_optd = 0;
foreach($DATA as $EACHOPTION){

// Checking some internal stuff, this works
if(IFISVALID){ // Now lets say it is valid, it will output some options

            // Option echo
    echo '<option';

            // Some code to show the first option as selected and setting some
            // later needed POST javascript variables
    if($select_optd == 0){
    echo ' selected="selected" ';
    $select_optd = 1;   
    $show_ctrl_id = $EACHOPTION['id'];
    $show_ctrl_spot = $EACHOPTION['spot'];
    }

            // echo the option html data

    echo  ' id="PRJ_OPT_'.$EACHOPTION['id'].$EACHOPTION['spot'].'" >';
    echo $EACHOPTION['title'] . ' - Spot: ' . $EACHOPTION['spot'];
    echo '</option>';

    ?>

    <script type="text/javascript">
            // Now the Javascript for when the option is selected
    $(document).ready(function(){   

    $('#PRJ_OPT_<?php print($EACHOPTION['id']); print($EACHOPTION['spot']);?>').click(function(){

            // An image showing the option selected     
    $('#PRJ_IMG_SHOW').attr('src','<?php print($EACHOPTION['image_url']); ?>'); 

            // Some posting inputs for later on
            $('#w_prj_id_send').val('<?php print($EACHOPTION['id']); ?>');
    $('#w_prj_spot_send').val('<?php print($EACHOPTION['spot']); ?>');

            // An alert to test if it's working  
    alert('Changed');
        });

    }); 
    </script>

    <?php   
    }else{ // that option was not valid, next one. }

} // End of Foreach
?>
</select>

问题是这个选项的.click（）事件只适用于firefox。我试过Chrome，IE ......只适用于Firefox。

这个问题有解决方法或解释吗？

// --------------------------------------------- -------------------- // 解决方案：

<script type="text/javascript">
    $(document).ready(function(){   

        $('#prj_selector').change(function(){
        var SELECTED_PRJ = $('#prj_selector').val();    

        <?php
        foreach($DATA as $EACHOPTION){
        ?>  
            if(SELECTED_PRJ == '<?php echo $EACHOPTION['title'] . ' - Spot: ' . $EACHOPTION['spot']; ?>'){
            $('#PRJ_IMG_SHOW').attr('src','<?php print($EACHOPTION['image_url']); ?>'); 
            $('#w_prj_id_send').val('<?php print($EACHOPTION['id']); ?>');
            $('#w_prj_spot_send').val('<?php print($EACHOPTION['spot']); ?>');
            }
        <?  
        }
        ?>                      

        });
    }); 
</script>

Answer 1

因为<select>是一个控件，而不是普通元素。

使用.change()代替select元素本身。

Answer 2

对于选择框，您可以使用.change（）事件而不是.click

http://comp345.awardspace.com/select_element_cheatsheet.pdf

为什么选择选项上的.click（）只适用于firefox？

2 个答案: