Question

我想知道如何将整个div设置为页面顶部的动画，现在看起来很简单，但即使经过大量的研究，我也无法弄清楚我做错了什么，它只是赢了不行，所以这是我的代码：

<script type="text/javascript" src="jquery.min.js"></script>
<script>
$(document).ready(function()
{
    $('#q').bind('webkitspeechchange',function()
    {
        $(this).parent('form').submit();
    });
});
function check()
{
    var searchtext = document.getElementById("q").value;
    if(searchtext=='')
    {
        return false;
    }
    else
    {
        return true; 
    }
}
$( document ).ready(function() {
  $("#q").focus();
});



$("#button").click( function() {             
    $("#content").animate({
        top: 0
    },1000)
});



</script>

我正在尝试将#content设置为顶部，以供参考，这是完整的页面：http://dev.thiv.net/

我真的被卡住了，任何帮助都会非常感激！感谢

Answer 1

您的脚本出现在相关元素之前。您需要在 DOM Ready Handler 中包含该内容才能使事件正确绑定

<script> 
    $(document).ready(function () {
        $('#q').bind('webkitspeechchange', function () {
            $(this).parent('form').submit();
        });

        $("#q").focus();
        $("#button").click(function () {
            $("#content").animate({
                top: 0
            }, 1000)
        }); 
    });

    function check() {
        var searchtext = document.getElementById("q").value;
        if (searchtext == '') {
            return false;
        } else {
            return true;
        }
    }
</script>

此外，您可以将所有代码包含在单个ready处理程序中，而不是将其放在多个实例下。此外，最好将脚本标记放在正文的结束标记之前，以获得更好的性能。

看起来您的按钮位于表单内部。因此，如果您希望它可以工作，则需要阻止表单的默认操作。删除表单的onsubmit事件，并使用jQuery提交表单。

$("#button").click(function (e) {
     e.preventDefault();
     $("#content").animate({
        top: 0
     }, 1000);

    var check = check();
    if(check) {
       $('form').submit();
    }
});

查询div动画

1 个答案: