JQuery будет работать с Fiddler, но не на моем сервере - PullRequest
0 голосов
/ 29 апреля 2011

Fiddler Link: http://jsfiddle.net/nLxc4/5/

Мой код:

<html>

<head>
    <script type="text/javascript" src="js/jquery-1.5.1.min.js"></script>
<script type="text/javascript">
function dynamicSearch() {
    var val = $('#search').val();
    if (val == '') val = '.';
    var srch = new RegExp(val, "gi");

    $('.active').each(function(i, el) {
        if ($(this).text().match(srch)) {
            $(this).show();
        } else {
            $(this).hide();
        }
    });
}

$(':checkbox').bind('change', function() {
    var div = this.value.replace('value', '#div');

    if (this.checked) {
        $(div).addClass('active');
        $(div).show();
    } else {
        $(div).removeClass('active');
        $(div).hide();
    }
});

$('#search').bind('keyup', dynamicSearch);
</script>
</head>

<body>

<form>
    <label for="search">Search:</label>
    <input type="text" name="search" id="search"/>

    <input type="checkbox" name="modtype" value="value1" />value1
    <input type="checkbox" name="modtype" value="value2" />value2
    <input type="checkbox" name="modtype" value="value3" />value3
    <input type="checkbox" name="modtype" value="value4" />value4
    <input type="checkbox" name="modtype" value="value5" />value5
    <div class="row" id="div1" style="display:none">Show Div 1</div>
    <div class="row" id="div2" style="display:none">Show Div 2</div>
    <div class="row" id="div3" style="display:none">Show Div 3</div>
    <div class="row" id="div4" style="display:none">Show Div 4</div>
    <div class="row" id="div5" style="display:none">Show Div 5</div>
</form>
</body>

</html>

Как вы можете видеть, в Fiddler, когда вы нажимаете флажок, он отображает определенный div. На моем домашнем сервере ничего не происходит. Кто-нибудь может понять, почему это так? Большое спасибо.

Ответы [ 2 ]

1 голос
/ 29 апреля 2011

Jsfiddler, оборачивает код js внутри $(document).ready(), если вы выбираете jQuery в качестве библиотеки.Вот почему он работает там, а не на вашем сервере.

Обновите в своем коде следующее

$(document).ready(function() {  //This
$(':checkbox').bind('change', function() {
    var div = this.value.replace('value', '#div');

    if (this.checked) {
        $(div).addClass('active');
        $(div).show();
    } else {
        $(div).removeClass('active');
        $(div).hide();
    }
});

$('#search').bind('keyup', dynamicSearch);
}); //And This
0 голосов
/ 29 апреля 2011

Измените свой код:

$ (function () {$ (': checkbox'). Bind ('change', function () {var div = this.value.replace ('value','#div');

if (this.checked) {
    $(div).addClass('active');
    $(div).show();
} else {
    $(div).removeClass('active');
    $(div).hide();
}

});

$ ('# search'). bind ('keyup', dynamicSearch);}

...