1

divonclickを正常に表示/非表示にできます。しかし、div表示を1秒間クリックすると、ページが更新されます。私はjavascriptを使用しています。コード：

       @{var Count = 0;}
 foreach (var commentlist in Model.Comments.Where(x => x.CommentParentID == 0))
  {
 <div id="@Count" style="display: none;">
<input type="submit" id="reply" class="reply-link" onclick="return showHide(@Count);" value="Reply" />
 @{Count++; }
</div>
}


<script type="text/javascript">
 function showHide(Count) {
        var ele = document.getElementById(Count);
        if (ele.style.display == "block") {
            ele.style.display = "none";           
        }
        else {
            ele.style.display = "block";
        }
    }
</script>
4

2 に答える 2

0

これは、ページが送信されているために発生します。<input type="button"...>代わりに使用してみてください<input type="submit"...>

ここでの違い：<input type='button'/>と<inputtype='submit'/>の違い

また、コントロールIDは数字で始めることはできず、一意である必要があります。

@{var Count = 0;}
foreach (var commentlist in Model.Comments.Where(x => x.CommentParentID == 0))
{
    <div id="div_@Count" style="display: none;">
        <input type="submit" id="reply_@Count" class="reply-link" onclick="return showHide('mydiv_@Count');" value="Reply" />
        @{Count++; }
    </div>
}
于 2013-01-07T07:26:14.747 に答える
0

送信ボタンが内部にある場合、ページをクリックした後に送信されたくない場合は、から行う<form>必要があります。return falseshowHide

<script type="text/javascript">
function showHide(Count) {
    var ele = document.getElementById(Count);
    if (ele.style.display == "block") {
        ele.style.display = "none";           
    }
    else {
        ele.style.display = "block";
    }

    return false; // <-- that's important to prevent the page from submitting
}
</script>

また、id属性はHTMLの数字で始めることはできないことに注意してください。したがって、マークアップを修正してください。

@{var Count = 0;}
foreach (var commentlist in Model.Comments.Where(x => x.CommentParentID == 0))
{
    <div id="mydiv_@Count" style="display: none;">
        <input type="submit" id="reply" class="reply-link" onclick="return showHide('mydiv_@Count');" value="Reply" />
        @{Count++; }
    </div>
}


<script type="text/javascript">
function showHide(id) {
    var ele = document.getElementById(id);
    if (ele.style.display == "block") {
        ele.style.display = "none";           
    }
    else {
        ele.style.display = "block";
    }
    return false;
}
</script>
于 2013-01-07T07:26:54.717 に答える