2012-12-05 4 views
0

동적으로 생성 된 TextBox 및 Button 컨트롤 (ASP.NET C# 페이지)을 사용하여 (버튼을 클릭하여) 텍스트를 추가하는 자바 스크립트 기능을 작성해야합니다. 해당 텍스트 옆에있는 삭제 아이콘 (사용자가이 텍스트를 삭제할 수 있음)을 클릭하고 일부 컨테이너 (div 또는 무언가)에 배치하십시오.자바 스크립트에서 텍스트와 작은 삭제 아이콘으로 div 컨테이너를 만드는 방법

명확하게 설명했는지 모르겠지만이 stackoverflow 태그 영역과 매우 유사한 것을 만들려고합니다. (제 경우에는 단추를 클릭하여 태그를 만들어야합니다). enter image description here

또한 게시 후 해당 값을 가져와야합니다 (사용자가 해당 페이지를 제출 한 후 데이터베이스에 기록하십시오). 감사합니다. 버튼의 클릭에

<script type="text/javascript"> 
function addTo(val) 
{ 
    document.getElementById('MainContent_txtbox').value = ""; 
    var lblLink = document.createElement("span"); 
    lblLink.appendChild(document.createTextNode(val));  
    document.getElementById('addItHere1').appendChild(lblLink); 
} 
</script> 

이 div 태그 모든

Label Labe3 = new Label(); 
Labe3.Text = "<div id=\"addItHere" + itemCounter.ToString() + "\" ></div>"; 
+0

아주 멋진 이드처럼 들리는 예! 지금까지 뭐 해봤 어? 어려움을 겪고 있습니까? –

+0

삭제 아이콘에는 body에서 onclick 이벤트 후 js에 의해 인식되고 "delete (target.parentNode)"명령 또는 유사한 명령으로 종료되는 "class"가 있습니다. –

+0

@Asad 예, javacript 함수를 만듭니다. function addTo (val) { document.getElementById ('MainContent_txtbox'). value = ""; 버튼을 클릭하면 div 태그 에 표시됩니다. Label Labe3 = new Label(); Labe3.Text = "

"; 하지만 계속 진행하기가 어렵습니다 (사용자가 삭제하고 포스트 백에서 해당 값을 가져올 수 있음). –

답변

1

처음에 표시됩니다 : 몸의 onclick에 연결하는 방법 : 당신이해야

<span class="post-tag">text<span class="delete-tag" onclick="delete(this.parentNode);">x</span></span> 

다음 단계 태그, 대상을 결정하는 방법, 클래스 속성을 확인하는 방법, 값을 "delete-tag"와 비교하는 것.

+0

감사합니다! 좋은 출발점! –

관련 문제