2013-02-20 1 views
0

누구든지 설명을하기 위해 Drupal webform 텍스트 영역에 고스트 (연한 회색) 텍스트를 추가하는 방법을 알고 있습니까? 고스트 텍스트는 사용자가 텍스트 영역에 무엇인가를 입력하면 사라집니다. 필요가 텍스트 영역 ID로 page.tpl에Drupal webform 텍스트 영역에 유령 텍스트를 추가하는 방법은 무엇입니까?

<script language="javascript" type="text/javascript"> 

function placeholder() 
{ 
var input = document.getElementById ("edit-message"); 
input.placeholder = "Add Your Text Here"; 

} 
</script> 

교체 "편집 메시지"를 헤드 섹션에이 코드를 붙여, 모든 모듈을 설치하지 장소 홀더

을 위해 자바 스크립트를 사용하는

+0

직접 프로그래밍 하시겠습니까? 당신은 단순히 드루팔 (Drupal)에서 폼을 만들고 필드 모듈에 옵션을 갖고 싶습니까? 이 모듈은 직접 프로그래밍하는 경우 도움이 될 수 있습니다. http://drupal.org/project/placeholder –

답변

0

아주 간단한 (화재 버그 사용)

추가 onload = "javascript : placeholder();" body 태그에

<body onload="javascript:placeholder();" class="<?php print $body_classes; ?>"> 
장소 홀더를 사용하는

간단한 방법이 도움이되기를 바랍니다!

+0

[권장] (https://developer.mozilla.org/en-US/docs/DOM/event#HTML_attribute)를 사용하여 HTML에서 이벤트 처리기를 사용하지 않고 이벤트를 요소에 연결합니다. 또한 필요한 모든 것이 textarea 태그에 추가 된 단순한 속성 일 때 JS가이 코드로이 작업을 수행하는 이유는 무엇입니까? 어쨌든 JS 사용을 끝내면 자리 표시 자 속성의 요점은 무엇입니까? –

0

당신이 찾고있는 행동은 최신 브라우저 (Firefox 4 이상, Opera 11 이상, Safari 4 이상, Chrome 4 이상)의 입력란에 구현 된 HTML5 '자리 표시 자'속성으로 해결됩니다. IE10 + :(

그래서 이럴 당신이 입력 필드에 '자리 표시 기능'을 구현하는 두 가지 방법이 있습니다

1) 빠른 & 더러운 방법 : 자바 스크립트 이벤트 핸들러를 사용하여. JS가 활성화 된 경우이 방법으로 기존 브라우저와 최신 브라우저를 동시에 지원할 수 있습니다.

2) 오른쪽의 & 주목할만한 해결책 : HTML5 '자리 표시 자'속성 사용.

두 번째 방법은 구현하기가 어렵습니다. 왜냐하면 자리 표시 자 속성이 Drupal 7 양식에서 기본적으로 지원되지 않기 때문입니다. Drupal이 placeholder = "hint ..."속성으로 필드를 렌더링하게하려면 :

a) Webform Module v.7.x-3.x 또는 7.x-4.x를 사용하여 양식을 작성하는 경우 http://nathanbuskirk.com/drupal7-placeholder-text-and-html5-forms

에서 다음에 설명 된대로, 테마의 template.php 파일에 전 과정을) ... 양식 마크 업을

B를 http://drupal.org/node/1305826 및/또는 : 그냥이 스레드에 게시 패치를 적용 두 경우 모두, IE6-9 및 다른 오래된 브라우저의 지원은 Placeholder.js (https://github.com/jamesallardice/Placeholders.js) 또는 JQuery의 Simple-Placeholder.js (https://github.com/marcgg/Simple-Placeholder)

과 같은 일부 pollyfill JS 라이브러리를 추가로 사용해야합니다.

희망이 있습니다.

관련 문제