어떻게 자바 스크립트를 사용하여 여러 개의 이미지로 HTML 버튼을 대체합니까?

내가 현재 가지고 :어떻게 자바 스크립트를 사용하여 여러 개의 이미지로 HTML 버튼을 대체합니까?

//javascript 
function morshots() 
{ 
    var mordor = document.getElementById("ss1"); 
    var shots= (
    mordor.innerHTML = <img src="http://i.imgur.com/83HCt.png" alt="scrns1"><img src="http://i.imgur.com/5mWIy.png" alt="scrns2"><img src="http://i.imgur.com/pPafl.png" alt="scrns3">; 
}

및

<!--html--> 
<!DOCTYPE html> 
<html> 
    <head> 
     <script type="text/javascript" src="screenshots.js"></script> 
    </head> 
    <body> 
     <div id="ss1"> 
      <button onClick="morshots();">View Screenshots</button> 
     </div> 
    </body> 
</html>

현재 버튼을 클릭에 아무것도하지 않는다. 내가 원하는 것은 이미지가 페이지의 버튼을 대체하는 것입니다. 이것은 전체 코드가 아니지만 가독성을 위해 관련성이없는 코드는 생략했습니다.

--EDIT--

나는 이미지 태그 주위의 내부 시세 및 비 이스케이프 따옴표 탈출을 추가했습니다. 난 아직도 페이지와 같은 결과를 얻고있다 (버튼 클릭은 아무것도하지 않는다)

function morshots() 
{ 
var mordor = document.getElementById("ss1"); 
mordor.innerHTML = '<img src=\"http://i.imgur.com/83HCt.png\" alt=\"scrns1\"><img src=\"http://i.imgur.com/5mWIy.png\" alt=\"scrns2\"><img src=\"http://i.imgur.com/pPafl.png\" alt=\"scrns3\">'; 
}'

--- EDIT2 : ----

그것은, 작업 코드를 읽고 수정 :

function morshots() 
{var mordor = document.getElementById("ss1"); 
mordor.innerHTML = '<img src=\"http://i.imgur.com/83HCt.png\" alt=\"scrns1\"><img src=\"http://i.imgur.com/5mWIy.png\" alt=\"scrns2\"><img src=\"http://i.imgur.com/pPafl.png\" alt=\"scrns3\">'; 
}

출처

2012-11-19 Bennett

당신이 놓치고 인용 부호를'img' 태그 –

주위에 그조차 어떻게 작동 JS합니까? 과제에 따옴표가 없습니다. –

따옴표 안에 <img>의 추가

function morshots() 
{ 
    var mordor = document.getElementById("ss1"); 
    mordor.innerHTML = '<img src="http://i.imgur.com/83HCt.png" alt="scrns1"><img src="http://i.imgur.com/5mWIy.png" alt="scrns2"><img src="http://i.imgur.com/pPafl.png" alt="scrns3">'; 
}

출처

2012-11-19 18:47:42 CoursesWeb

당신은 오류에 대한 자바 스크립트 콘솔을 확인 했습니까?

// syntax error: 
var shots= (

// syntax error: 
mordor.innerHTML = <img src="http://i.imgur.com/83HCt.png" alt="scrns1"><img src="http://i.imgur.com/5mWIy.png" alt="scrns2"><img src="http://i.imgur.com/pPafl.png" alt="scrns3">;

문자열을 mordor.innerHTML으로 전달해야합니다. html을 따옴표로 묶어야합니다. shots으로 무엇을하려고하는지 잘 모르겠습니다.

출처

2012-11-19 18:48:17 gilly3

그들 앞에 \ 따옴표를 추가하고 HTML은 백 슬래시를 추가 withing에 그들을 탈출 :

var mordor = document.getElementById("ss1"); 
mordor.onclick = function() { 
    var shots= "<img src=\"http://i.imgur.com/83HCt.png\" alt=\"scrns1\"><img src=\"http://i.imgur.com/5mWIy.png\" alt=\"scrns2\"><img src=\"http://i.imgur.com/pPafl.png\" alt=\"scrns3\">"; 
    mordor.innerHTML = shots; 
};

출처

2012-11-19 18:55:26 suricactus

어떻게 자바 스크립트를 사용하여 여러 개의 이미지로 HTML 버튼을 대체합니까?

답변

관련 문제