在下面的例子中,我有几个对象。我想一次性更改所有对象的标签,而不是通过id调用每个元素。我知道如何在HTML中执行此操作,但不能在Flex中执行此操作。
// HTML
<div class="text" id="text1">SomeText</div>
<div class="text" id="text2">SomeText</div>
<div class="text" id="text3">SomeText</div>
// jQuery
$(".text").css("color", "#333333");
我通常会在一行中将3个对象的颜色设置为灰色。
// Flex
<s:Button id="button1" label="Button 1"/>
<s:Button id="button2" label="Button 2"/>
<s:Button id="button3" label="Button 3"/>
// AS3
button1.label = 'Something else';
button2.label = 'Something else';
button3.label = 'Something else';
有没有什么办法可以用一行代码改变所有3个按钮的标签,类似于jQuery示例?提前谢谢。
答案 0 :(得分:3)
我很确定答案是否定的,但需要注意。
请记住,JQuery是一个隐藏其正在执行的复杂性的框架。 (许多框架都会这样做,包括flex Framework)。在Flex中,我可以在一行代码中创建一个DataGrid。但是,有数千行代码,并且已经编写了多个类,允许我这样做。我怀疑很多JQuery功能也是如此。
没有理由不能封装该功能来进行更改,然后使用一行代码调用它。
答案 1 :(得分:1)
正如@ www.Flextras.com指出的那样 - 你可以写一个类来做这个。
我鼓励你考虑另一种方法,因为寻找特定属性的孩子们的循环很慢。也就是说 - 它确实带来了有趣的编码挑战。
这是一个班级&amp;这个例子应该能够实现你所追求的目标。
package com.mangofactory.util
{
import flash.display.DisplayObject;
import mx.core.UIComponent;
/**
* Utility class to set a given property of all matching children on a target.
* Named to act as an operator, rather than a class (hence no captial letter)
*
* eg., on(someTarget).of(SomeClass).someProperty = someValue;
* */
public class on
{
private var root:UIComponent;
private var requiredPropertyName:String;
private var requiredType:Class;
public function on(root:UIComponent)
{
this.root = root;
}
/**
* Returns a list of targets which match the defined criteria.
* Note - the root component is also evaluated
* */
private function get targets():void
{
var result:Array = [];
if (matches(root))
{
result.push(root);
}
for (var i:int = 0; i < root.numChildren; i++)
{
var child:DisplayObject = root.getChildAt(i);
if (matches(child))
result.push(child);
}
}
/**
* Returns true if the target param matches the defined criteria.
* If a propertyName has been given (by calling 'having') that is checked first.
* Otherwise, the type is checked against the value passed calling ('of')
* */
private function matches(target:Object):Boolean
{
if (requiredPropertyName && target.hasOwnProperty(requiredPropertyName))
return true;
if (requiredType && target is requiredType)
return true;
return false;
}
public function having(propertyName:String):PropertyCatcher
{
this.requiredPropertyName = propertyName;
}
public function setOnTargets(propertyName:*,value:*):void
{
for each (var matchedTarget:Object in targets)
{
if (matchedTarget.hasOwnProperty(propertyName))
matchedTarget[propertyName] = value;
}
}
public function of(type:Class):PropertyCatcher
{
this.requiredType = type;
}
}
}
import com.mangofactory.util.on;
import flash.utils.Proxy;
import flash.utils.flash_proxy;
use namespace flash_proxy;
dynamic class PropertyCatcher() extends Proxy
{
private var callbackTarget:on;
public function PropertyCatcher(callbackTarget:on)
{
this.callbackTarget = callbackTarget;
}
override flash_proxy function setProperty(name:*, value:*):void {
callbackTarget.setOnTargets(name,value);
}
}
一个例子:
<?xml version="1.0" encoding="utf-8"?>
<mx:Canvas xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx">
<s:Button />
<s:Button />
<s:Button />
<mx:Canvas />
<fx:Script>
<![CDATA[
public function doTest():void
{
// Sets the label of all Buttons to "Hello World"
on(this).of(Button).label = "Hello World";
// Sets the visible property of all children which declare a "alpha" property to false.
on(this).having("alpha").visible = false;
}
]]>
</fx:Script>
</mx:Canvas>
注意 - 我没有对此进行过测试,但理论上它应该有效。
答案 2 :(得分:0)
我不知道flex的css3 / jquery类型的任何选择器。但是一个解决方法是使用一组按钮而不是许多按钮变量,然后迭代所有按钮变量(按钮[i]而不是buttoni)