9

我正在开发一个使用 jQuery 的滑块。滑块的某些元素工作正常，但我正在尝试使用某些代码进行故障排除。为了测试它，我希望能够在语句中显示变量的值。

这是我正在使用的代码块：

$('.marquee_nav a.marquee_nav_item').click(function(){
        $('.marquee_nav a.marquee_nav_item').removeClass('selected');
        $(this).addClass('selected');

        var navClicked = $(this).index();
        var marqueeWidth = $('.marquee_container').width();
        var distanceToMove = marqueeWidth * (-1);
        var newPhotoPosition = (navClicked * distanceToMove) + 'px';
        var newCaption = $('.marquee_panel_caption').get(navClicked); 

        $(' .marquee_photos').animate({left: newPhotoPosition}, 1000);
        });

我添加了一个名为“test”的 div，我想在其中显示变量的值以确保它们返回预期的结果：

<div class="test"><p>The value is: <span></span></p></div>

例如，为了测试这些值，我将其插入到上面的语句中：

$('.test span').append(marqueeWidth);

但是，我没有得到任何结果。在该代码块中包含测试以确保获得预期结果的正确方法是什么？

谢谢。

4

3 回答 3

19

只需使用JavaScript 的console函数在浏览器控制台中记录您的变量。

var myVar = 123;
console.log(myVar, "Hello, world!");

示例控制台图像

如果您不确定如何在浏览器中打开控制台，请参阅：https ://webmasters.stackexchange.com/questions/8525/how-to-open-the-javascript-console-in-different-browsers

于 2013-10-15T13:13:39.300 回答
3

append用于附加 HTML 字符串、DOM 元素、DOM 元素数组或 jQuery 元素。由于您只是想显示一个数字 ( marqueeWidth)，您可能想要设置text跨度的 ：

$('.test span').text(marqueeWidth);

另外，您不只使用控制台是否有特殊原因？阅读调试 JavaScript演练可能值得一读。

于 2013-10-15T13:13:04.593 回答
2

您可以使用以下内容。

$('.test span').html(marqueeWidth);

但是做一个console.log(yourvariable);或alert(yourvariable);更好。

于 2013-10-15T13:14:21.047 回答