appendTo()를 사용하고 div에서 변수로 콘텐츠를 추가 전환

Question

사용자가 다른 옵션을 선택하여 다른 추가 콘텐츠를 추가 할 수있는 기본 콘텐츠 div가 포함 된 페이지를 만들려고합니다. 추가 된 콘텐츠는 더욱 다양한 콘텐츠를 추가 할 수있는 옵션을 제공합니다. 최종 목표는 짧은 대화 형 이야기를 만드는 것입니다.

부분적으로 새로운 접근 방식을 반영하여 편집되었지만 여전히 작동하지 않습니다. 오류없이

<div id="ongoingStory"> 
    <p>You're standing in a place. There are whatever items here and one or more exits.</p> 
    <p>Do you want to take <span id="action1">action 1</span> or <span id="action 2">action 2</span>?</p> 
</div> 

var oneResult = "<p>You take action 1, and some stuff happens. You can then take <span id=\"action3\">action 3</span> or <span id=\"action4\">action 4</span>.</p>"; 
var anotherResult = "<p>You take action 2, and other stuff happens. You can then take <span id=\"action5\">action 5</span> or <span id=\"action6\">action 6</span>.</p>"; 

var root; 
var branch; 

function addToStory(root,branch) { 
    $("#" + root).addClass("disabled"); 
    $(branch).appendTo("#ongoingStory").hide().fadeIn(1000); 
} 

document.getElementById("ongoingStory").addEventListener("click", moveAlong, false); 

function moveAlong(e) { 
    if (e.target !== e.currentTarget) { 
     switch (e.target.id) { 
     case action1:addToStory(action1,oneResult);break; 
     case action2:addToStory(action2,anotherResult);break; 
     case action3:addToStory(action3,otherResult);break; 
     case action4:addToStory(action4,yetOtherResult);break; 
     }; 
    }; 
    e.stopPropagation(); 
} 

페이지가로드,하지만 난 처음에 ongoingStory 사업부 내에서로드하는 내용의 조치를 클릭 할 때 아무 반응이 없습니다 :

나의 현재 코드는 다음과 같습니다. 그러면 콘솔에서 "ReferenceError : action3이 정의되지 않았습니다."라고 알려줍니다. 물론 그 action/id 태그를 포함하는 내용이 추가되지 않기 때문에 그렇지 않습니다. 내가 이해할 수없는 것은 처음부터 콘텐츠를 추가하지 않는 이유입니다. 나는 아마도 스팬의 ID를 올바르게 참조하지 않고 있다고 생각했지만,이 경우 스위치가 action1에서 멈추는 것을 기대합니다.

Answer 1

코드에 몇 가지 문제가 있습니다. 우리는 아득히 실제 문제로, 당신은 몇 가지 따옴표를 놓치고 covered the best practices in the chat room.했습니다

case action1:addToStory(action1,oneResult);break; 

요구가 될 :

 case 'action1': 
      addToStory('action1', oneResult); 
      break; 

(같은 다른 모든 행동에 대한)

다음은 JSFiddle입니다. http://jsfiddle.net/somekittens/70qebhbm/