0

单击链接后，我正在尝试制作 FadeOut 效果。但我的语法似乎是错误的。当我单击时，它会淡出，然后转到“~~nothing~~.html”页面，它只是没有获得组成变量的值。id boo 附加到标签 ( body id="boo" ) 并且在 css 样式表中 id #boo设置为display:none; 我正在使用 jquery-1.7.2.min

<script type="text/javascript">
    $(document).ready(function(){
        $('#go').click(function(e) { //When something with the id 'go' is clicked, 
            e.preventDefault(); //Prevent default action (?)
            var url = $('#go').val() + ".html"; //set url as "Clicked 'go' value + .html" (374.html"
            $('#boo').fadeOut(600, function() { window.location.href = url; }); //fadeOut what is with the 'boo' id (body), and load the created address as a new page (?)
        });
    });
</script>
<a id="go" value="374" href="#">Go to page 374</a>

374.html 页面位于同一文件夹中。如果可能的话，请解释我做错了什么，并逐步进行。我是 jquery 的新手。

谢谢！

4

4 回答 4

3

该.val()方法仅适用于字段，仅将value属性放在任何元素上都不会被该val()方法读取。

而是使用.attr('value').

或者，使用data-*属性和使用data()方法是更好的做法：

<script type="text/javascript">
    $(document).ready(function(){
        $('#go').click(function(e) { //When something with the id 'go' is clicked, 
            e.preventDefault(); //Prevent default action (?)
            var url = $('#go').data('value') + ".html"; //set url as "Clicked 'go' value + .html" (374.html"
            $('#boo').fadeOut(600, function() { window.location.href = url; }); //fadeOut what is with the 'boo' id (body), and load the created address as a new page (?)
        });
    });
</script>
<a id="go" data-value="374" href="#">Go to page 374</a>
于 2012-08-07T12:15:45.237 回答
1

尝试：

var url = $('#go').attr("value") + ".html";

代替

var url = $('#go').val() + ".html";

来自 jQuery文档-

.val() 方法主要用于获取输入、选择和文本区域等表单元素的值。在元素的情况下， .val() 方法返回一个包含每个选定选项的数组；如果未选择任何选项，则返回 null。

这里有一个例子 - http://jsfiddle.net/A8ArH/

于 2012-08-07T12:15:22.883 回答
1

该val()函数不会为您提供来自锚标记的值，用于attr("value")获取 a 标记的值

$(document).ready(function(){
    $('#go').click(function(e) { 
        e.preventDefault(); 
        var url = $('#go').attr("value") + ".html"; 
        alert(url)
        $('#boo').fadeOut(600, function() {
                 window.location.href = url; 
        });
    });
});​

或者，您可以使用 HTML 5data属性来存储此类值

<a id="go" data-someValue="374" href="#">Go to page 374</a>

你可以像这样在javascript中访问它

var someVal=$("#go").data("someValue");

示例http://jsfiddle.net/LyPZB/1/

于 2012-08-07T12:15:27.543 回答
1

a标签不支持属性value ，你应该这样做：

像这样设置锚点

<a id="go" data-page="374" href="#">...

（data-xxx 是自定义属性）

并获得它的价值

$('#go').data('page')

这样它就可以工作并且您将尊重 HTML 标准（因为锚不应该具有 value 属性）

于 2012-08-07T12:17:46.750 回答