我创建了一个 div 对象作为另一个 div 对象的拖动 handle 。我想添加一些自定义属性并初始化它。我已经完成了这个(正如你所看到的，我正在使用一些 jQuery):
$(document).ready(function(){
...
// initialise object properties & variables
var SDStartValDragger = {
beginDragPos: 0,
currentPos: 0,
mouseIsDown: false,
[bg]:css("background-color": "black")
}
// make the drag handle change to red while the mouse is over it
$(".HDragHandle").mouseover(function() {
$(this).css({"background-color": "red"});
});
// make the drag handle change to black while the mouse leaves it
$(".HDragHandle").mouseleave(function() {
$(this).css("background-color": "black");
});
//I'm trying to convert to OO coding style, so I can do the previous with
// $(".HDragHandle").mouseover(function() {
// $(this).bg="red";
// or similar.
}
我不明白如何为 SDStartValDragger 对象初始化 css 对象的 background-color 值？在我的代码正文(初始化后)中，我还希望能够简单地通过 SDStartValDragger.bg = "red"设置 SDStartValDragger 的 background-color “
html 正文部分如下所示，是否有帮助？
<body>
<div id='SDviz'></div>
<div id='SDscope'>
<div id='SDvalueSetter'>
<div id='SDStartValDragger' class='HDragHandle'></div>
<div id='SDEndValDragger' class='HDragHandle'></div>
</div>
</div>
<div id='SDvalueContainer'>
<div id='SDStartVal'>29-02-2013<br/>09:30:01</div>
<div id='SDEndVal'>13-12-2015<br/>14:30:00</div>
</div>
<div>
<div id='startVal'>0</div>
<div id='endVal'>0</div>
</div>
<div>
<div id='currentStartVal'>0</div>
<div id='currentEndVal'>0</div>
</div> </body>
</html>
最佳答案
听起来您希望 bg 成为访问器属性。从应该在哪里或如何设置 background-color 的问题来看，根本不清楚，但这是如何执行访问器部分的:
var SDStartValDragger = {
// ...your other properties...
set bg(value) {
// Use value to set background-color
},
get bg() {
// Return the current background-color
}
};
这要求浏览器中的 JavaScript 引擎至少支持 ES5 (2009)，因此在 IE8 上不起作用，而 IE8 在此之前已经发布了。
下面是一个对象示例，该对象包装 DOM 元素并在 DOM 元素上设置 background-color (通过 jQuery)以响应 bg 属性，例如上图:
var SDStartValDragger = {
element: $("#target"),
set bg(value) {
this.element.css("background-color", value);
},
get bg() {
return this.element.css("background-color");
}
};
setTimeout(function() {
SDStartValDragger.bg = "red";
}, 400);
setTimeout(function() {
SDStartValDragger.bg = "green";
}, 800);<div id="target">This is the target element</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>关于javascript - 如何简化 Javascript 对象以便设置 obj.BG ='red' 而不是 obj.css ("style": "value")，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/34531919/