Javascript onclick顯示/隱藏div元素

我是JavaScript新手，我需要一些幫助。我正在開發一個網站，其中我有一個按需定製的「添加治療筆記」。Javascript onclick顯示/隱藏div元素

1.如果我點擊「添加治療筆記」，相應的兩個<div>應該打開，如果<div>處於打開狀態「添加治療筆記」按鈕應該將文本更改爲「隱藏治療筆記」。

<div id="divpopup"><button>Add treatment notes</button></div>

2.如果單擊「隱藏處理說明」，則兩個div的數據應該隱藏起來。

<td class="ir-shade4" colspan="2"> 
    <div id=irid1><p><em>If injured,mark location</em></p> 
    <img src="{{ STATIC_URL }}images/spotmarker.jpeg"/></div> 
</td> 
<td class="ir-shade3" colspan="2"> 
    <div id=irid2><p>Actions</p> 
    <p><input id="ir-box" type="checkbox"/>01.Allowed to rest and returned to class</p> 
    <p><input id="ir-box" type="checkbox"/>02.Contacted parents/guardians</p> 
    <p><strong><em>Treatment given,or other notes</em></strong></p> 
    <textarea class="textarea" name="description"></textarea> 
    <p><input id="ir-box2" type="checkbox"/>No furthur action needed</p> 
    </div> 
    </td>

編輯：

$(document).ready(function() { 
    $("#divpopup").css("display", "none"); 
}); 

function addtreatment() { 
    var hideValue = $("#irid1").val(); 
    var hideValue = $("#irid2").val(); 
    var newHideValue = 0; 
    if (hideValue == 0) { 
     newHideValue = 1; 
     } 
     else 
     { 
     newHideValue = 0; 
     } 
    if (newHideValue == 0) { 
     $("#divpopup").css("display", "none"); 
    } 
    else 
    { 
     $("#divpopup").css("display", "block"); 
    } 
    $("#irid1").val(newHideValue); 
    $("#irid2").val(newHideValue); 

    return false; 
    }

請告訴我如何實現這在我的網頁。

感謝

來源

2013-04-17 user2086641

你有沒有嘗試任何旁邊的HTML代碼？如果是，請發佈您嘗試的腳本。 –

Kishor，我試着用上面的代碼，但它不工作，如果我想改變一些事情，請告訴我，我想讓這個功能工作 – user2086641

給按鈕一個ID可以說

<button id="test">Add treatment notes</button>

然後

$(document).ready(function(){ 

$("#test").click(function(){ 
    $("#irid1").toggle(); 
    $("#irid2").toggle(); 
    if ($("#irid1").is(":visible")) { 
     $("#test").html('Hide treatment notes'); 
    } else { 
     $("#test").html('Show treatment notes'); 
    } 
}); 
});

來源

2013-04-17 05:09:36

嗨，我跟着你的代碼，切換沒有發生，是否需要初始化不同的功能，請幫我 – user2086641

我會檢查並恢復先生 – user2086641

好吧檢查我的答案正確我更新，然後只是使用和嘗試它。 –

既然你jQuery標記你的問題，你可能想尋找到jQuery的toggle()，show()，hide()，text()和click功能。這可能會讓你開始。當你有一些代碼可供分享時，請隨時回來問一些更詳細的問題。

來源

2013-04-17 05:05:40 Steve

您可以使用此

$('#divpopup').click(function() 
{ 
    $('.ir-shade4').toggle(); 
    $('.ir-shade3').toggle(); 
}

然後用$('#divpopup').text('Hide treatment notes');

我會離開它一個鍛鍊自己擺在一個if statemetn檢查什麼，你應該文本設置爲

來源

2013-04-17 05:07:21 Daveo

Javascript onclick顯示/隱藏div元素

回答

相關問題