0
私はタブ付きのパネルを持っており、各タブが同じHTMLファイル内で分割を開くJS関数を使っています。私はデフォルトで表示される最初のタブを設定しました（これらのコンテンツは、ページが読み込まれるとアクティブになります）。しかし、2番目のタブをクリックしようとすると、指定したタブの内容が表示されません。各タブの下に表示されている表示タブの内容 - Javascript
HTMLフォームは
最初のタブの内容は、部門の下
<div id="addRequest" class="tabcontent">
<div id="form_container">
<!--<h1><a>Acquisition</a></h1>-->
<form id="form_1147240" class="appnitro" method="post" action="">
<div class="form_description">
<h2>Acquisition</h2>
<p>Enter the details of the material required</p>
</div>
<ul >
<div id="leftDiv" style="float: left; width: 50%;" >
<!--Material Type-->
<li id="li_7" >
<label class="description" for="element_7">Material Type </label>
<div class = "listItems">
<select class="element select medium" id="element_7" name="element_7">
<option value="" selected="selected"></option>
<option value="1" >Books</option>
...
が
2つ目のタブの内容がウントです
addRequest分裂していますER分割addNewMaterial分割
<div id="addNewMaterial" class="tabcontent">
<div id="form_container1">
<form id="form_11472401" class="appnitro" method="post" action="">
<div class="form_description">
<h2>Acquisition</h2>
<p>Enter the details of the new material</p>
</div>
<ul >
<div id="leftDiv1" style="float: left; width: 50%;" >
<!--Material Type-->
<li id="li_71" >
<label class="description" for="element_71">Material Type </label>
<div class = "listItems">
<select class="element select medium" id="element_71" name="element_71">
<option value="" selected="selected"></option>
<option value="1" >Books</option>
タブ区分
<body>
<ul class="tab">
<li><a href="#" class="tablinks" onclick="openTab(event, 'addRequest')">Add Request</a></li>
<li><a href="#" class="tablinks" onclick="openTab(event, 'addNewMaterial')">New Materials</a></li>
</ul>
<div id="addRequest" class="tabcontent">
<div id="form_container">
JS機能
function openTab(evt, divisionId) {
// Declare all variables
var i, tabcontent, tablinks;
// Get all elements with class="tabcontent" and hide them
tabcontent = document.getElementsByClassName("tabcontent");
for (i = 0; i < tabcontent.length; i++) {
tabcontent[i].style.display = "none";
}
// Get all elements with class="tablinks" and remove the class "active"
tablinks = document.getElementsByClassName("tablinks");
for (i = 0; i < tablinks.length; i++) {
tablinks[i].className = tablinks[i].className.replace(" active", "");
}
// Show the current tab, and add an "active" class to the link that opened the tab
document.getElementById(divisionId).style.display = "block";
evt.currentTarget.className += " active";
}
ブラウザインスペクタ（F12）で2番目のタブ内容のCSSを検査しましたか？無効なhtmlとは別に、私は間違ったことは何も見ません。 –
前述のとおり、addNewMaterialディビジョンはaddRequestディビジョン内に埋め込まれていました。したがって、addRequestディビジョンのdisplayプロパティをnoneに設定し、addNewMaterialsディビジョンのdisplayプロパティでブロックを表示すると、そのプロパティは無効にされていて、両方を表示していませんでした。提案のための百万を感謝します。それは固定された –