如何选中复选框并在文本框中显示值以及未选中复选框时不显示值

要实现这个功能，你可以使用HTML、CSS和JavaScript来完成。以下是一个简单的示例：

HTML部分

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Checkbox and Textbox Example</title>
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <div class="container">
        <label>
            <input type="checkbox" id="myCheckbox">
            Show Value
        </label>
        <input type="text" id="myTextbox" disabled>
    </div>
    <script src="script.js"></script>
</body>
</html>

CSS部分（可选）

/* styles.css */
.container {
    margin: 20px;
}

label {
    margin-right: 10px;
}

input[type="text"] {
    margin-top: 10px;
}

JavaScript部分

// script.js
document.addEventListener('DOMContentLoaded', function() {
    const checkbox = document.getElementById('myCheckbox');
    const textbox = document.getElementById('myTextbox');

    checkbox.addEventListener('change', function() {
        if (checkbox.checked) {
            textbox.value = 'Checked';
            textbox.disabled = false;
        } else {
            textbox.value = '';
            textbox.disabled = true;
        }
    });
});