버튼을 클릭 할 때 style.display를 none에서 inline으로 변경하려면 어떻게해야합니까?

버튼을 클릭하면 id="text"을 표시하고 싶습니다. 그래서 이것을 시도 :버튼을 클릭 할 때 style.display를 none에서 inline으로 변경하려면 어떻게해야합니까?

<form name="i_choose_form" action="" method="post"> 
     <input type="submit" class="button" value="I am not sure, show me other choices..." onclick = "showText()"></br> 
    </form> 

    <span id ="text" style="display:none">First make your choice then you can see all other choices</span> 

    <script type = "text/javascript"> 

function showText() { document.getElementById("text").style.display="inline"; } 

</script>

그러나 이것은 예상대로 작동하지 않으며 텍스트가 표시되지 않습니다. 내가 도대체 뭘 잘못하고있는 겁니까? 양식이 원하는 결과를 방해처럼 http://jsfiddle.net/dPhUQ/

출처

2011-11-18 Zeynel

표시되지만 페이지를 제출하고 있습니다. = '버튼'을 입력하는 대신

<input type="button" class="button" value="I am not sure, show me other choices..." onclick = "showText()"></br>

출처

2011-11-18 15:05:11

감사합니다. Pointy의 대답으로 jfiddle 설정을 변경했습니다. – Zeynel

것 같습니다, 대신이 시도 : 페이지가 양식을 제출한다 그래서 당신은 제출 버튼의 클릭 이벤트를 취소하지 않는

<div onclick = "showText()">Click me</div>

출처

2011-11-18 15:04:11 ToddBFisher

onclick = "showText(); return false;"

실제로 추가 할 이벤트는 unobtrusively입니다.

<input type="submit" id="showMore" class="button" value="I am not sure, show me other choices..." onclick = "showText()"> 
<script type="text/javascript"> 
    function showText() { 
     document.getElementById("text").style.display="inline"; 
    } 
    document.getElementById("showMore").click = showText; 
</script>

출처

2011-11-18 15:04:22 epascarello

나는이 시도 '제출'을 입력을 변경하지만 여전히 페이지 http://jsfiddle.net/dPhUQ/1/ 당신이하지 않은 – Zeynel

상쾌한 것 같다 예제를 올바르게 복사했습니다. 'onclick = "showText()"return false;는'onclick = "showText(); return false;"가되어야합니다. " – kapa

죄송합니다. 감사. 두 버튼 모두 "제출"버튼과이 버전이 작동합니다. 하나를 선택할 이유가 있습니까? – Zeynel

문제는 jsfiddle을 설정 한 방법입니다. 왼쪽에는 사이트에서 자바 스크립트를 결과 페이지에 통합하는 방법을 선택하는 풀다운 메뉴가 있습니다. "포장하지 말 것"으로 설정하면 효과가 있습니다. 글쎄, 실제로는 작동하지 않지만, 당신의 기능을 호출 할 것입니다.

다음 문제는 처리기가 실행 된 후 즉시 "제출"버튼이 양식을 제출한다는 것입니다. 이를 방지하려면 이벤트 전파를 중지해야합니다.

출처

2011-11-18 15:04:57 Pointy

버튼을 클릭 할 때 style.display를 none에서 inline으로 변경하려면 어떻게해야합니까?

답변

관련 문제