Question

我正在尝试使用Ajax在页面上更改结果。我使用简单的文本链接工作，但我不能使用下拉列表来工作。

我尝试过添加：

if ($('.myclass').change

和

$('.results').on('change','.myclass', function (e) {

我不确定如何从下拉列表中获取值或需要更改哪些内容以使用下拉列表。

这是使用简单的href：

的工作代码

if ($('.myclass').length) {
    var paginate = function (url) {
        var param = '&ajax=1',
            ajaxUrl = (url.indexOf(param) === -1) ? 
                       url + '&ajax=1' : 
                       url,
            cleanUrl = url.replace(new RegExp(param+'$'),'');

        $.ajax(ajaxUrl)
            .done(function (response) {
                $('.results').html(response);
                $('html, body').animate({
                    scrollTop: $('.results').offset().top
                });
                window.history.pushState(
                    {url: cleanUrl},
                    document.title,
                    cleanUrl
                );
            })
            .fail (function (xhr) {
                alert('Error: ' + xhr.responseText);
            });

   }
$('.results').on('click','.myclass a', function (e) {
    e.preventDefault();
    var url = $(this).attr('href');
    paginate(url);
});

window.onpopstate = function(e) {
    if (e.state.url) {
        paginate(e.state.url);
    }
    else {
        e.preventDefault();
    }
};        
}

Answer 1

如果您的选择标记是这样的：

<select name="" id="test">
        <option value="1">One</option>
        <option value="2">Two</option>
    </select>

你的jquery可以使用：

来定位它

<script>
$("#test").change(function(){
    alert($(this).val());
});
</script>

或

<script>
$("#test").on('change', function(){
    alert($(this).val());
});
</script>

修改

对于您不需要像在链接上那样在下拉列表中使用preventDefault（），这可能不会导致问题。

Ajax - 根据下拉列表返回结果

1 个答案: