Почему мой jQuery не работает локально?

Я использую следующий код на jsfiddle.net, и предварительный просмотр работает. Запускаю свою локальную копию и ничего...

Флажки должны меняться при нажатии радиокнопки.

Предварительный просмотр jsfiddle: http://jsfiddle.net/XqFDN/

<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" ></script>
    <script>
        jQuery('#3day').click(function () {
            jQuery('#mon , #tue , #wed').attr('checked', true);
        });
        jQuery('#2day , #1day').click(function () {
            jQuery('#mon , #tue , #wed').attr('checked', false);
        });
    </script>
</head>

<body>
    <form>
        <input type="radio" name="passes" value="3day" id="3day" />3-Day
        <input type="radio" name="passes" value="2day" id="2day" />2-Day
        <input type="radio" name="passes" value="1day" id="1day" />1-Day
        <br />

        <input type="checkbox" name="mon" value="mon" id="mon" />Mon
        <input type="checkbox" name="tue" value="tue" id="tue" />Tue
        <input type="checkbox" name="wed" value="wed" id="wed" />Wed
        <br />
    </form>
</body>
</html>

javascript click jquery attr jsfiddle
person mpdc    schedule 14.01.2013    source источник
comment
При выборе фреймворка в вашей скрипке вы не выбрали обертку (тело). Код, который вы вставили, эквивалентен варианту без переноса (голова).   -  person David Hedlund    schedule 14.01.2013
comment
Знаете ли вы, что вам нужно написать jQuery в полной форме только один раз? Обернув свой код в (function($) { .... })(jQuery);, вы можете использовать $ независимо от того, использовался ли noConflict или нет. // И вы должны использовать .prop('checked', true_or_false) вместо attr   -  person ThiefMaster    schedule 14.01.2013
comment
Мне даже не пришло в голову использовать .prop, так как .attr работал нормально - спасибо.   -  person mpdc    schedule 14.01.2013
comment
Дубликат Почему jQuery или метод DOM, такой как getElementByID, не находит элемент?.   -  person Felix Kling    schedule 14.01.2013
comment
Дубликат Как разместить коды с jsfiddle.net на своем веб-сайте?   -  person Bergi    schedule 11.09.2016

Ответы (1)


arrow_upward
8
arrow_downward

Вам нужно обернуть код jQuery в обработчик готовности документа. Попробуй это:

<script type="text/javascript">
    jQuery(function() { // alternative: $(document).ready(function() {
        jQuery('#3day').click(function () {
            jQuery('#mon , #tue , #wed').attr('checked', true);
        });
        jQuery('#2day , #1day').click(function () {
            jQuery('#mon , #tue , #wed').attr('checked', false);
        });
    });
</script>

Этот корпус гарантирует, что код внутри него запускается при загрузке DOM. В настоящее время ваш код пытается прикрепить события click к еще не существующим элементам.

person Rory McCrossan    schedule 14.01.2013
comment
Правильный. И вставленная скрипка работает не потому, что она выполняется в DOMReady, а потому, что она выполняется в нижней части BODY. - person David Hedlund; 14.01.2013
comment
Спасибо - простое исправление, которое я буду использовать во всем своем кодировании. - person mpdc; 14.01.2013