jq 点击按钮 如果文本框有文字 则把文字添加到列表里面 如果没有文字 则弹窗
时间: 2024-05-01 14:22:11 浏览: 12
可以使用以下的 jQuery 代码实现:
```html
<!-- HTML 结构 -->
<input type="text" id="input-text">
<button id="add-button">Add to list</button>
<ul id="list"></ul>
```
```javascript
// jQuery 代码
$(document).ready(function() {
$('#add-button').click(function() {
var inputText = $('#input-text').val();
if (inputText !== '') {
$('#list').append('<li>' + inputText + '</li>');
} else {
alert('Please enter some text.');
}
$('#input-text').val('');
});
});
```
上述代码中,我们首先在 HTML 中创建了一个文本框和一个按钮,以及一个空的列表。然后在 jQuery 代码中,我们使用 `$(document).ready()` 函数来确保页面加载完成后再执行代码。接着,我们绑定了按钮的点击事件,当按钮被点击时,我们获取文本框的值并检查是否为空。如果文本框不为空,我们将输入的文本添加到列表中,并清空文本框;如果文本框为空,则弹出警告框提示用户输入文本。最后,我们使用 `$('#input-text').val('')` 将文本框的值清空,以便用户输入下一个值时不必手动清空。