Question

我的JQuery代码有一个奇怪的问题。我试图将CSS属性更改为页面上的某个元素。

这是我尝试运行和工作的代码：

$("#player").css({
    "width" : "+=10"
});

我的问题是，当我尝试从函数中使用此代码时，它可以正常工作。

这是功能：

   function change_elem_size (elemID,whatToChange,value) {
     $('#' + elemID).css({
        whatToChange : value
     });
   }

这就是我调用函数的方式：

function move_right (elemID,event) {
    $(document).keydown(function(event){
       change_elem_size(elemID,"width","+=10");
       });
}


    $(document).ready(function(){

      move_right("player",event);
    });

为什么我不能使用函数来更改css属性？

（对不起我的英文）

Answer 1

为什么我不能使用函数来更改css属性？

你可以。不能做的是使用动态键作为对象文字。这意味着当你这样做：

{
    whatToChange : value
}

它将whatToChange 视为属性的名称，而不是包含应该是属性名称的值的变量。你必须这样做：

function change_elem_size (elemID,whatToChange,value) {
    var options = {}
    options[whatToChange] = value;
    $('#' + elemID).css(options);
}

Answer 2

对象初始值设定项内的属性初始值设定项的左侧（:之前的位）始终是文字，而不是变量。所以这段代码：

function change_elem_size (elemID,whatToChange,value) {
    $('#' + elemID).css({
        whatToChange : value
    });
}

..设置属性whatToChange，它不使用变量的值来设置属性名称。为此，请不要使用对象：

function change_elem_size (elemID,whatToChange,value) {
   $('#' + elemID).css(whatToChange, value);
}

...或者可选地使用对象，但使用括号表示法，以便whatToChange的值成为属性名称。要做到这一点，你必须首先构造对象，然后将属性添加到它（你不能使用对象初始化器）：

function change_elem_size (elemID,whatToChange,value) {
    var change = {};
    change[whatToChange] = value;
    $('#' + elemID).css(change);
}

代码不在函数内运行

2 个答案: