我有两组函数,一个更改div的背景颜色(动态创建的div或已经存在的div)和第二个添加新div的函数divs ,其中class =“divplace”。
点击事件的工作方式如下: 1)单击ID =“background_color_button”的“按钮”,然后在要更改背景颜色的div上。 或 2)单击ID =“clicker”的“按钮”,在div中添加div。
这是第一个:
var $currentInput = null;
$("#background_color_button").live("click", function() {
$currentInput = null;
if ($currentInput == null) {
$currentInput = $(this).prev();
$("label").html($currentInput.attr("id"));
}
});
var editid;
$("div.editable").live("click",function(e) {
e.stopPropagation();
if ($currentInput == null)
return;
var css = GetCssProperties();
$(this).css(css);
$("label").html("");
});
function GetCssProperties() {
if ($currentInput == null) return null;
var value = $currentInput.val();
if ($currentInput.attr("id") == "background-color") {
return {
"background-color": value
}
}
}
这是第二个:
var $currentDiv = null;
$("#clicker").live("click", function() {
$currentDiv = null;
if ($currentDiv == null) {
$currentDiv = $(this).prev();
$("label").html($currentDiv.attr("id"));
}
});
var editid;
$(".divplace").live("click",function(e) {
e.stopPropagation();
if ($currentDiv == null)
return;
var newdiv = "<div class='editable divplace'>The Div created inside of this div needs to be able to change the BG color without adding a new div</div>";
$(this).append(newdiv);
$("label").html("");
});
这是JSFiddle文档:
http://jsfiddle.net/TSM_mac/QYAB9/
我的问题是,一旦你在Div内部创建一个Div(带有class =“divplace”),你就不能在不添加新Div的情况下改变创建的Div的颜色。我希望能够在Div中创建无限量的Div,并且总是在不添加新Div的情况下改变颜色。
非常感谢!
泰勒
答案 0 :(得分:0)
看了这个例子后,我认为你想要做的只是执行你选择的最后一个动作(颜色改变或添加div),而不是两者。如果是这样,这样就可以了:
基本上,当点击一个动作时,另一个动作被清除。这样每次单击都会更改颜色或添加div,但不能同时添加两者。
此外,还有很多方法可以改进您的代码。特别:
$currentDiv = null;
if ($currentDiv == null) {
$currentDiv = $(this).prev();
$("label").html($currentDiv.attr("id"));
}
您正在设置$ currentDiv = null,然后检查它是否为null。它将始终为null,因为您将其设置为null。然后你把它设置为其他东西,基本上是= null而if是没有意义的。这是等效的:
$currentDiv = $(this).prev();
$("label").html($currentDiv.attr("id"));