Question

我想在1天内检测国家/地区选择并在Cookie上存储选定的选项，当您在1天之前重新加载网站时，网站首选项应通过以下方式加载：

$('#country-options')[0].value = getCookie("selectedLanguage");

我如何实现这一目标？请指教。

以下是我的.js代码。

function setCookie(c_name, value, exdays) {
    var exdate = new Date();
    exdate.setDate(exdate.getDate() + exdays);
    var c_value = escape(value)
            + ((exdays == null) ? "" : "; expires=" + exdate.toUTCString());
    document.cookie = c_name + "=" + c_value;
}

function getCookie(c_name) {
    var i, x, y, ARRcookies = document.cookie.split(";");
    for (i = 0; i < ARRcookies.length; i++) {
        x = ARRcookies[i].substr(0, ARRcookies[i].indexOf("="));
        y = ARRcookies[i].substr(ARRcookies[i].indexOf("=") + 1);
        x = x.replace(/^\s+|\s+$/g, "");
        if (x == c_name) {
            return unescape(y);
        }
    }
}

function languageSelected() {
    //= $('#country-options')[0].value;
    var languageSelected = $('#country-options').val();
    alert(" tt " + languageSelected);
    var selected = $('#country-options').options[$('#country-options').selectedIndex];
    selected.setAttribute("selected", "selected");
    var oldselected = $('#country-options').options[0];
    oldselected.removeAttribute("selected");
    if (languageSelected !== "fr") {
        setCookie("selectedLanguage", languageSelected, 1);
        alert("Welcome again " + languageSelected);
    } else {
        alert("W " + languageSelected);
    }

    //$('#countryform').submit();
}

$(document).ready(function() {

    // --- language dropdown --- //

    // turn select into dl
    createDropDown();

    var $dropTrigger = $(".dropdown dt a");
    var $languageList = $(".dropdown dd ul");

    // open and close list when button is clicked
    $dropTrigger.toggle(function() {
        $languageList.slideDown(200);
        $dropTrigger.addClass("active");
    }, function() {
        $languageList.slideUp(200);
        $(this).removeAttr("class");
    });

    // close list when anywhere else on the screen is clicked
    $(document).bind('click', function(e) {
        var $clicked = $(e.target);
        if (!$clicked.parents().hasClass("dropdown"))
            $languageList.slideUp(200);
        $dropTrigger.removeAttr("class");
    });

    // when a language is clicked, make the selection and then hide the list
    $(".dropdown dd ul li a").click(function() {
        var clickedValue = $(this).parent().attr("class");
        var clickedTitle = $(this).find("em").html();
        $("#target dt").removeClass().addClass(clickedValue);
        $("#target dt em").html(clickedTitle);
        $languageList.hide();
        $dropTrigger.removeAttr("class");
    });






    $('#country-options')[0].value = getCookie("selectedLanguage");


    $('#country-options').bind('change', function() { // bind change event to select
        var url = $(this).val(); // get selected value
        alert("WFFFFFF " + url);
        if (url != '') { // require a URL
            window.location = url; // redirect
        }
        return false;
    });
});

// actual function to transform select to definition list
function createDropDown() {
    var $form = $("div#country-select form");
    $form.hide();
    var source = $("#country-options");
    source.removeAttr("autocomplete");
    var selected = source.find("option:selected");
    var options = $("option", source);
    $("#country-select").append('<dl id="target" class="dropdown"></dl>')
    $("#target").append(
            '<dt class="' + selected.val()
                    + '"><a href="#"><span class="flag"></span><em>'
                    + selected.text() + '</em></a></dt>')
    $("#target").append('<dd><ul></ul></dd>')
    options.each(function() {
        $("#target dd ul").append(
                '<li class="' + $(this).val() + '"><a href="'
                        + $(this).attr("title")
                        + '"><span class="flag"></span><em>'
                        + $(this).text() + '</em></a></li>');
    });
}


<form name="countryform" action="index.jsp">
    <select id="country-options" name="country-options">
        <option  selected="selected" value="">Pick a Website</option>
        <option title="index.jsp" value="fr">France</option>
        <option title="index.jsp" value="uk">United Kingdom</option>
        <option title="index.jsp" value="es">Espana</option>
        <option title="index.jsp" value="de">Germany</option>
    </select>
</form>

但我在此代码之前加载了另一个以（function（$，undefined）{，revslider.jquery.themepunch.revolution.js开头的js到我的网页.jsp文件中。

<script type="text/javascript"
src="js/revslider.jquery.themepunch.revolution.js"></script>
<script> my code </script>

Answer 1

取决于您正在使用的jQuery版本，但如果您使用的是最新的jQuery版本，则.bind()会被弃用。

所以你可以使用

$('#country-options').on('change', function() {
    // Code here.
});

jQuery API .on()链接 - ＆gt; http://api.jquery.com/on/

更改事件不在选择列表上工作

1 个答案: