1. 程式人生 > >HTML5:Animate cc互動功能之製作單選框(開關)

HTML5:Animate cc互動功能之製作單選框(開關)

1.需要實現的效果

2.步驟:

a.實現點選功能

S.xld_btn1.txt.text="";//先將單選框的文字清空

//S.xld_btn1.txt.text是舞臺上的"xld_btn1影片剪輯",txt是指文字,text指文字內容

if(!S.xld_btn1.btn_0.hasEventListener("click"))
{
    S.xld_btn1.btn_0.addEventListener("click", xld_btn1Event);//點選btn0,跳到點選事件
}

b.實現開關

function xld_btn1Event(e) {
	if (S.xld_btn1.currentFrame == 0) //判斷影片剪輯這個元件裡面的幀數為,當前幀為0幀的時候
	{
		S.xld_btn1.gotoAndStop("frame2"); //讓影片剪輯裡的幀數,跳轉到frame2,也就是開啟
		for (i = 1; i < 3; i++) {
			if (!S["xld_btn1"]["btn_" + i].hasEventListener("click", xld_btn_Click)) {
				S["xld_btn1"]["btn_" + i].addEventListener("click", xld_btn_Click); //給btn1、2按鈕2個點選事件
			}

		}
	} else {
		for (i = 1; i < 3; i++) {
			S["xld_btn1"]["btn_" + i].removeEventListener("click", xld_btn_Click); //刪除點選事件
		}
		S.xld_btn1.gotoAndStop("frame1"); //回到第0幀,也就是關閉
	}
}

c.判斷對錯,和,插入單選框相應的文字

function xld_btn_Click(e) {
	S.xld_btn1.btn_0.removeEventListener("click", xld_btn1Event); //刪除xld_btn1Event事件
	for (i = 1; i < 3; i++) {
		S["xld_btn1"]["btn_" + i].removeEventListener("click", xld_btn_Click); //刪除btn1、2點選事件
	}
	num = e.currentTarget.name.charAt(4); //獲取當前元件名字、擷取第4位也就是1,2
	if (num == 1) //如果點選的是btn1
	{
		S.xld_btn1.txt.text = "陽性";
		alert("選擇有誤,正確答案應該為陽性")
	} else //也就是點選的是btn2
	{
		S.xld_btn1.txt.text = "陽性";
		alert("選擇正確");
	}
	S.xld_btn1.gotoAndStop("frame1"); //讓xld_btn1這個影片剪輯,在第0幀停止播放
	S.gotoAndPlay(); //繼續播放
}