Question

我正在尝试显示名为“slider”的div的“正确”值，将其显示在“span.display_value”

中

    var rightStyleValue = $('div.slider').css('right');
    alert(rightStyleValue); 
    $('.display_value').html(rightStyleValue);

更新：Html发布在下方。我正在使用拖放脚本来拖动一个名为“slider”的div，它位于名为“container”的div中。当div“滑块”的“正确”属性达到45px时（理想情况下，当用户将“滑块”一直拖到它的父“容器”的右侧时，我想让它“做某事”）

现在，当页面加载时，它将显示我在css中专门设置的值：“Right：-10”。所以它会显示一次，但我不知道如何继续更新“滑块”div的显示值。

我不知道放在哪里：$（'。display_value'）。html（rightStyleValue）;让它不断更新。

<head>
    <style>
        div.container {
        height:15px;
        width:200px;
        overflow:hidden;
        background-color:#858585;
        }

        div.slider {
        height:15px;
        width:20px;
        background-color:#000;
        position:relative;
        right:-10px;
        }
    </style>

<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/easing.js"></script>      
<script type="text/javascript" src="js/dragcopy.js"></script>  



<script>

    $().ready(function() {
        $('.slider').jqDrag();

        $('.slider')
        .jqDrag();
    });

    $(document).ready(function() {

        var rightStyleValue = $('div.slider').css('right');
        alert(rightStyleValue); 
    $('.display_value').html(rightStyleValue);  

    $(".slider").mousedown(function() {
        if ($('.slider').css('right') == -8 + "px") {
                $('.container').fadeOut('slow');
        } 

    });
    });




    </script>

</head>
<body>




    <div class="container">
        <div class="slider">

        </div>
    </div>
    <p>slider right:<span class="display_value"> </span></p>




</body>

Answer 1

$('span.display_value').text($('div.slider').css('right'));

使用.text（x），而不是.html（）或.val（）

Answer 2

我认为@Ivan Nevostruev是对的。只是建议另一个合乎逻辑的步骤。您的问题代码正在做两件事，获取正确的样式值并将其设置为另一个元素。

您应该将这些分解为两个单独的步骤，以找出导致您的错误的步骤，即：

var rightStyleValue = $('div.slider').css('right');
alert(rightStyleValue);

$('span.display_value').val(rightStyleValue);

然后，一旦你知道哪个动作导致了问题，你就可以进一步分解它，通过测试是你的选择器工作，即：

alert($('div.slider'));

如果结果为null或未定义，则选择器出现问题。

@Ivan可能是对的，但没有看到你的HTML，可能是一堆问题。打破它总能帮助我。

Answer 3

看起来你在css方法调用后有额外的护腕。另外，我认为val应该替换为text。这是一个例子：

$('span.display_value').text($('div.slider').css('right'));

使用JQuery显示div的“正确”样式

3 个答案: