这是我的javascript代码:
function htmlshw(){
document.getElementById('ht').style.display = "visible";
document.getElementById('jq').style.display = "none";
document.getElementById('sc').style.display = "none";
}
function jqshw(){
document.getElementById('ht').style.display = "none";
document.getElementById('jq').style.display = "visible";
document.getElementById('sc').style.display = "none";
}
function csshw(){
document.getElementById('ht').style.display = "none";
document.getElementById('jq').style.display = "none";
document.getElementById('sc').style.display = "visible";
}
此代码用于隐藏和显示文本框，我在 PHP 页面中有一个 HTML 代码，如下所示
<body>
<img src="/code.png" id="flip" onclick="showbox()" style="left: 0px; top: 20%; position: fixed; z-index: 99999;"></img>
<section id="codebox" >
<form action="/code.php" method="send" >
<table>
<tr>
<button onclick="javascript:htmlshw()">HTML</button>
<button onclick="javascript:csshw()">CSS</button>
<button onclick="javascript:jqshw()">JS</button>
</tr>
<tr class="c">
<section id="ht" class='hm'style="display: block;">
<textarea type="text" name="HTML" ><?php echo $_REQUEST['HTML']; ?></textarea>
</section>
</tr>
<tr class="c">
<section id="sc" class='cs' style="display: none;">
<textarea type="text" name="CSS" ><?php echo $_REQUEST['CSS']; ?></textarea>
</section>
</tr>
<tr class="c">
<section id="jq" class='jq' style="display: none;">
<textarea type="text" name="JS" ><?php echo $_REQUEST['JS']; ?></textarea>
</section>
</tr>
<input type="submit" value="Compile" style="position: fixed; right: 0px; top: 10px; z-index: 999999; "></input>
</table>
</form>
</section>
<section id="result">
<?php echo $_REQUEST['HTML']; ?>
</section>
</body>
根据设计，我已经放置了 3 个按钮并分配了各自的功能，但它似乎不起作用。这背后有什么技术原因吗？
最佳答案
你应该使用display:block;，而不是visible。
<button onclick="javascript:htmlshw();">HTML</button>
<button onclick="javascript:jqshw();">JavaScript</button>
<button onclick="javascript:csshw();">CSS</button>
<section id="ht" class='hm'style="display: visible;">
<textarea type="text" name="HTML" ><?php echo $_REQUEST['HTML']; ?></textarea>
</section>
</tr>
<tr class="c">
<section id="sc" class='cs' style="display: none;">
<textarea type="text" name="CSS" ><?php echo $_REQUEST['CSS']; ?></textarea>
</section>
</tr>
<tr class="c">
<section id="jq" class='jq' style="display: none;">
<textarea type="text" name="JS" ><?php echo $_REQUEST['JS']; ?></textarea>
</section>
function htmlshw(){
document.getElementById('ht').style.display = "block";
document.getElementById('jq').style.display = "none";
document.getElementById('sc').style.display = "none";
}
function jqshw(){
document.getElementById('ht').style.display = "none";
document.getElementById('jq').style.display = "block";
document.getElementById('sc').style.display = "none";
}
function csshw(){
document.getElementById('ht').style.display = "none";
document.getElementById('jq').style.display = "none";
document.getElementById('sc').style.display = "block";
}
此外，将您的按钮从您的表单中移除，这样他们就不会尝试发送表单。此外，method='send' 不是正确的 method，它应该是 GET 或 POST。
关于JavaScript 不适用于隐藏和显示文本框，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/29964588/