我有以下代码来显示基于单选按钮选择的文本框。然而,这行不通。如何使这段代码工作?
我希望文本框字段显示useDockerCompose是否选择为“是”,如果选择为“否”,则隐藏。
<tr><td>
<b>Docker Compose</b>
<a href="#" id="dcPop" rel="popover" data-content="Application deploys set to use docker compose to spin up the container" data-original-title="Use Docker Compose"><i class="icon-question-sign"></i></a>
</td><td>
<input type="radio" value="false" name="useDockerCompose" CHECKED> No
<input type="radio" value="true" name="useDockerCompose"> Yes
</td></tr>
<tr class="dccommandtext" style="display:none;">
<td nowrap><b>Docker Compose Command</b></td>
<td><input type="text" class="input-xxlarge" name="dccommand"></td>
</tr>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"/>
<script type="text/javascript">
$(document).ready(function() {
// Function to show/hide the Docker Compose Command input based on the selected radio button
function showdccommand() {
var selectedValue = $('input[name="useDockerCompose"]:checked').val();
console.log("Selected value: " + selectedValue); // For debugging
if (selectedValue === "false") {
$('.dccommandtext').hide();
} else {
$('.dccommandtext').show();
}
}
// Attach the 'change' event listener to the radio buttons
$('input[name="useDockerCompose"]').on('change', showdccommand);
// Trigger show/hide on page load to set the initial state based on the default selected value
showdccommand();
});
</script>