.push不在ie6或safari中工作

时间:2012-01-06 05:51:47

标签: javascript jquery html internet-explorer safari

我有一个点击事件,在firefox中运行得很好,即9.这个想法基本上是从下拉列表中选择并将值推入数组然后在div中显示。如果该值为空,则清空数组和div。点击“submitList”解析php中的列表。

有没有更好的方法与所有浏览器兼容?

HTML / PHP看起来像这样......

$chart_query = mysql_query("SELECT id, title FROM songs WHERE team_name='$team_name' ORDER BY title ASC");
while($row = mysql_fetch_array($chart_query)){
    $song_id = $row['id'];
    $song_title = $row['title'];

    $song_chart .= '<div align="left" class="song_links">';
    if ($logOptions_id == $admin_id) {
        $song_chart .= '<div id="songChart'.$song_id.'" style="border-bottom:1px dotted gray;">
        <select name="selection" class="selection">
            <option></option>
            <option value="01-'.$song_id.'&'.$song_title.'">1</option>
            <option value="02-'.$song_id.'&'.$song_title.'">2</option>
            <option value="03-'.$song_id.'&'.$song_title.'">3</option>
            <option value="04-'.$song_id.'&'.$song_title.'">4</option>
            <option value="05-'.$song_id.'&'.$song_title.'">5</option>
            <option value="06-'.$song_id.'&'.$song_title.'">6</option>
            <option value="07-'.$song_id.'&'.$song_title.'">7</option>
            <option value="08-'.$song_id.'&'.$song_title.'">8</option>
            <option value="09-'.$song_id.'&'.$song_title.'">9</option>
            <option value="10-'.$song_id.'&'.$song_title.'">10</option>
            <option value="11-'.$song_id.'&'.$song_title.'">11</option>
            <option value="12-'.$song_id.'&'.$song_title.'">12</option>
            <option value="13-'.$song_id.'&'.$song_title.'">12</option>
            <option value="14-'.$song_id.'&'.$song_title.'">14</option>
            <option value="15-'.$song_id.'&'.$song_title.'">15</option>
        </select>
     &ndash; <a href="http://' . $dyn_www . '/template.php?id='.$song_id.'" style="color:#9B1717; text-decoration:none;">'.$song_title.'</a> <img src="../images/loading.gif" id="chartDeletingpic'.$song_id.'" style="display:none;" /> <a href="#" onclick="deleteSongChart('.$song_id.')" style="color:gray; float:right; font-weight:100;">delete</a></div></div>';
    } else {
        $song_chart .= ' &ndash; <a href="http://' . $dyn_www . '/template.php?id='.$song_id.'" style="color:#9B1717; text-decoration:none;">'.$song_title.'</a></div>';
    }
}

这是另一部分......

        <div id="selectionButton" style="display:none; width:96%; clear:both; padding:3px 10px;">
    <label>List-Date</label><br />
        <select name="list_month_New" class="formFields" id="list_month_New">
        <option value=""></option>
        <option value="01">January</option>
        <option value="02">February</option>
        <option value="03">March</option>
        <option value="04">April</option>
        <option value="05">May</option>
        <option value="06">June</option>
        <option value="07">July</option>
        <option value="08">August</option>
        <option value="09">September</option>
        <option value="10">October</option>
        <option value="11">November</option>
        <option value="12">December</option>
        </select> 
        <select name="list_day_New" class="formFields" id="list_day_New">
        <option value=""></option>
        <option value="01">1</option>
        <option value="02">2</option>
        <option value="03">3</option>
        <option value="04">4</option>
        <option value="05">5</option>
        <option value="06">6</option>
        <option value="07">7</option>
        <option value="08">8</option>
        <option value="09">9</option>
        <option value="10">10</option>
        <option value="11">11</option>
        <option value="12">12</option>
        <option value="13">13</option>
        <option value="14">14</option>
        <option value="15">15</option>
        <option value="16">16</option>
        <option value="17">17</option>
        <option value="18">18</option>
        <option value="19">19</option>
        <option value="20">20</option>
        <option value="21">21</option>
        <option value="22">22</option>
        <option value="23">23</option>
        <option value="24">24</option>
        <option value="25">25</option>
        <option value="26">26</option>
        <option value="27">27</option>
        <option value="28">28</option>
        <option value="29">29</option>
        <option value="30">30</option>
        <option value="31">31</option>
        </select> 
        <select name="list_year_New" class="formFields" id="list_year_New">
        <option value=""></option>
        <option value="2011">2011</option>
        <option value="2012">2012</option>
        <option value="2013">2013</option>
        </select><br />
        <div>
            <div id="selected_songs" style="clear:both; padding:5px 0px; color:#225c7e;">
            </div>
            <div style="width:100%; background-color:#F3F3F3; border:1px solid #D1D1D1;">
                <div align="right">
                <img src="../images/loading.gif" id="songListLoading_New" style="display:none;" />
                <input id="submitList" type="submit" value="submit" class="submit" style="margin:0px;" />
                </div>
            </div>
        </div>
    </div>
    <div id="selectionBox" style="width:96%; clear:both; padding:3px 10px;">'.$song_chart.'</div>
    <input name="team_name" id="team_name" type="hidden" value="'.$team_name.'" /><br />
    </div>';

这是jquery ......

$(document).ready(function(){
    $(".selection").val("");
    $("#list_month_New").val("");
    $("#list_day_New").val("");
    $("#list_year_New").val("");

    $(".selection option").click(function(){
        s = [];
        $("#selectionBox select option:selected").each(function(){
            $("#selected_songs").text('');

            var v = $(this).val();
            if(v != ''){
                s.push(v);
            }
            if(s != ""){ 
                $('#selectionButton').show(); 
            }else{
                $("#list_month_New").val();
                $("#list_day_New").val();
                $("#list_year_New").val();
                $('#selectionButton').hide();
            }
        });
        s.sort();
        jQuery.each(s, function(){
                O = "";
                O = this+"<br />";
                str = /&(.+)/.exec(O)[1];
                num = O.replace(/\-.*/, '');
                fullString = '<span style="color:black">'+num+'</span> - '+str;
                $("#selected_songs").append(fullString);
        });
        $("#submitList").click(function(){
            if(s != ""){
                $("#songListLoading_New").show();
                var m = $("#list_month_New").val();
                var d = $("#list_day_New").val();
                var y = $("#list_year_New").val();
                var n = "<?php echo $team_name; ?>";
                if(m == "" || d == "" || y == ""){
                    alert("You must include an entire date");
                    $(".selection").val("");
                    $("#selected_songs").text("");
                    $('#selectionButton').hide();
                    $("#songListLoading_New").hide();
                    $("#list_month_New").val("");
                    $("#list_day_New").val("");
                    $("#list_year_New").val("");
                    s = '';
                }else{
                    $.post('scripts/sendList.php?id=<?php echo $id; ?>', {s:s, m:m, d:d, y:y, n:n}, function(data){
                    $(".list").prepend(data);
                    $(".list").slideDown(900);
                        $(".selection").val("");
                        $("#selected_songs").text("");
                        $('#selectionButton').hide();
                        $("#list_month_New").val("");
                        $("#list_day_New").val("");
                        $("#list_year_New").val("");
                        $("#songListLoading_New").hide();
                    }); s = '';
                }
            }
        });
    });
});

1 个答案:

答案 0 :(得分:0)

问题出在.selection和#selectionBox上。出于某种原因,它变得混乱,并且在其他浏览器中存在冲突。