Question

晚上好，

我开始使用JQuery / Javascript并且在输入内容并使内容显示在alert()时遇到了一些麻烦。

这是我到目前为止所写的内容 -

$(function(){
var input = $('#input').val();

    alert(input);
});

HTML信息

<input id="input" type="text" placeholder="Input here">

如果有人可以为我穿错了，我会感到非常感激

Answer 1

问题是您的代码会在加载页面时运行，您需要将代码绑定到按钮或<version>49-storage-gap</version>，change或其他内容。

喜欢这个

keyup

演示更改活动

＆＃13;

$(function() {
  $("#input").change(function() {
    var input = $('#input').val();

    console.log(input);
  })
});

＆＃13;

$(function() {
  $("#input").change(function() {
    var input = $('#input').val();

    console.log(input);
  })
});

＆＃13;

演示键盘事件

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="input" type="text" placeholder="Input here">

＆＃13;

$(function() {
  $("#input").keyup(function() {
    var input = $('#input').val();

    console.log(input);
  })
});

＆＃13;

请看这个解释jquery Events

的页面

Answer 2

之前的答案解释了为什么以及您可以采取的措施。让我最简单地添加一下，你会想要一些提交按钮，这样处理该输入值的代码只有在你点击该按钮后才能运行。在这种情况下，你可以这样做。

const btn = document.querySelector('button');
const input = document.querySelector('input');

btn.addEventListener('click', event => {
  alert(input.value);
});

<input id="input" type="text" placeholder="Input here">
<button>submit</button>

警报（）中显示的HTML输入

2 个答案: