입력 데이터 제거

Question

십자가 클릭 버튼에서 데이터가 포함 된 태그를 제거하고 싶습니다.

"remove-glyphicon"태그를 클릭하면 태그가 제거되어야합니다.

function toggleCloseColor(a) { 
 
    var opacity = a.css("opacity"); 
 
    opacity = opacity < .8 ? 1 : .6; 
 
    a.css({ 
 
    opacity: opacity 
 
    }); 
 
} 
 

 
${document}.ready(function() { 
 
    ${".tag a"}.each(toggleCloseColor); 
 
});

.tag.md { 
 
    font-size: 14px; 
 
} 
 
.tag { 
 
    padding: .3em .4em .4em; 
 
    margin: 0 .1em; 
 
    float: left; 
 
} 
 
.tag a { 
 
    color: #bbb; 
 
    cursor: pointer; 
 
    opacity: .5; 
 
} 
 
.tag .remove { 
 
    vertical-align: bottom; 
 
    top: 0; 
 
} 
 
.tag a { 
 
    margin: 0 0 0 .3em; 
 
} 
 
.glyphicon-white { 
 
    color: #fff; 
 
}

<script src="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script> 
 
<link href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet" /> 
 
<div class="tag label btn-info md"> 
 
    <span>com.example.ExampleSuite</span> 
 
    <a style="opacity: 0.6;"> 
 
    <i class="remove glyphicon glyphicon-remove-sign glyphicon-white"></i> 
 
    </a> 
 
</div>

내가 함수를 작성의 도움을 통해 자바 스크립트를 많이 시도하지만 난 클릭하여이 태그를 제거 할 수없는 생각 "제거-glyphone"

Answer 1

을이 작동한다 네가하는 일. jQuery가 관련되어 있지 않습니다. 사람들이 볼 수 있도록 코드를 가져 왔습니다.

<script> 
    function remove(elem) { 
    elem.parentElement.remove(); 
    } 
</script> 

<br/> 
Tags: 
<span class="tag label label-info"> 
    <span>Example Tag </span> 
    <a onClick="remove(this)"><i class="remove glyphicon glyphicon-remove-sign glyphicon-white"></i></a> 
</span> 

아마도 가장 쉬운 방법 인 요소에 요소를 전달하려는 것입니다. 그렇지 않으면 단추 누름을 처리하기 위해 이벤트 수신기를 설정할 수 있습니다.