댓글 comment 영역의 스크립트를 onclick 으로 바꾸기

현재 그누 기본 게시판의 각각의 댓글 영역은 아래처험 되어 있습니다.

<article id="c_123">
    html 코드;
    <script>댓글설정 토글옵션</script>
</article>

----------

그런데 이건 c_123 전체의 innerHTML 을 바꾸는 이벤트 (제이쿼리에서는 html() 인가? 제이쿼리는 한번도 안 써 봐서 그 이름을 잘 모르겠는데 여하튼)를 줄 수 없습니다.

가령 ajax 로 댓글을 수정하고 c_123 의 내용을 바꿀 때라거나 등등... 을 실행할 수 없는 것이

애초에 innerHTML 에는 자바스크립트 소스가 해당되지 않기 때문이죠.

그래서... 이걸 innerHTML 의 적용이 가능한 코드로 바꿔 보았습니다.

----------

view_comment.skin.php 에서

[code]

<button type="button" class="btn_cm_opt btn_b01 btn"><i class="fa fa-ellipsis-v" aria-hidden="true"></i><span class="sound_only">댓글 옵션</span></button>

위 부분을 찾아 아래처럼 바꿉니다.

<button type="button" class="btn_cm_opt btn_b01 btn" onclick="commentDisplay(this)"><i class="fa fa-ellipsis-v" aria-hidden="true"></i><span class="sound_only">댓글 옵션</span></button>

[/code]

----------

[code]

<ul class="bo_vc_act">

를 아래처럼 바꿉니다.

<ul class="bo_vc_act" style="display:none">

[/code]

----------

아래의 스크립트를 삭제합니다.

[code]

        <script>
            $(function() {                
            // 댓글 옵션창 열기
            $(".btn_cm_opt").on("click", function(){
                $(this).parent("div").children(".bo_vc_act").show();
            });
                
            // 댓글 옵션창 닫기
            $(document).mouseup(function (e){
                var container = $(".bo_vc_act");
                if( container.has(e.target).length === 0)
                container.hide();
            });
        });
        </script>

[/code]

----------

문서 하단에 아래의 스크립트를 추가합니다.

[code]

function commentDisplay() {
    redButton = arguments[0].nextElementSibling;
    if (redButton.style.display === "none") redButton.style.display = "block";
    redButton.onmouseover = function() { document.querySelector("body").onmouseup = function() { redButton.style.display = "block"; } }
    redButton.onmouseout = function() { document.querySelector("body").onmouseup = function() { redButton.style.display = "none"; } }
}

[/code]