Question

我做了一些代码来改变我的形象位置

此代码可以运行一次，但第二次不能运行。

function prev() {
                    if(document.getElementById("bookCon").style.left=="0px"){}
                    else {
                        document.getElementById("bookCon").style.right-="800px";
                    }
                }
                function next() {
                    if(document.getElementById("bookCon").style.left=="5000px") {}
                    else { 
                        document.getElementById("bookCon").style.right+="800px";
                    }
                }

第二版......也行不通。

function getStyleNum(item,prop) {
            if (typeof item == "string") { item = document.getElementById(item); }
            return parseInt(item.style[prop],10);
        }
        function prev() {
            var item = document.getElementById("bookCon");
            if (getStyleNum(item,"right") !== 0) {
                var val = getStyleNum(item, "right");
                item.style.right = (val - 800) + "px";
            }
        }
        function next() {
            var item = document.getElementById("bookCon");
            if (getStyleNum(item,"right") !== 1600) {
                var val = getStyleNum(item, "right");
                item.style.right = (val + 800) + "px";
            }
        }

Answer 1

您的代码存在多个问题：

你不能+= "800px"，因为你最终会得到像"500px800px"这样的字符串。
你不能对字符串做数学。
您无法与"0px"
您检查.left的值并设置.right的值。你应该只使用其中一个，而不是两个。
您的代码可能会更多干（不重复）
直接在对象上读取样式属性不包括通过样式表设置的任何内容

如果在对象上直接设置style.left值（并且最初不是来自样式表）并且您的对象已定位，则可以使用此类逻辑（转换为数字）。我不确切地知道你要通过检查.left然后更改.right来完成什么，所以这只是猜测你的逻辑，但是你应该能够看到关于如何你做这种事。

function prev() {
    var item = document.getElementById("bookCon");
    if (parseInt(item.style.left, 10) != 0) {
        var val = parseInt(item.style.right, 10) || 0;
        item.style.right = (val - 800) + "px";
    }
}

您可能会发现此util函数很有用：

function getStyleNum(item, prop) {
    if (typeof item == "string") {
        item = document.getElementById(item);
    }
    return parseInt(item.style[prop], 10) || 0;
}

function prev() {
    var item = document.getElementById("bookCon");
    if (getStyleNum(item, "left") != 0) {
        var val = getStyleNum(item, "right");
        item.style.right = (val - 800) + "px";
    }
}

P.S。我仍然不明白为什么要检查.left的值，然后修改.right的值。其中只有一个可以在给定时间激活。

工作演示：http://jsfiddle.net/jfriend00/awjv9/

无法使用javascript函数更改图像位置

1 个答案: