如何获取JavaScript将文本输入打印到控制台

Question

I am new to javascript programming so am hoping that this is a simple issue... I'm wanting my webpage to allow a user to input a music track name and artist in two separate fields and once you hit 'go' the javascript will run and parse the input into a string. 我是javascript编程的新手，所以希望这是一个简单的问题...我希望我的网页允许用户在两个单独的字段中输入音轨名称和艺术家，一旦您点击“开始”，javascript将运行并将输入解析为字符串。 To test I have tried to see if these inputs are being taken and I have tried to print them to console, however nothing is being printed to the console. 为了进行测试，我尝试查看是否已接受这些输入，并且尝试将它们打印到控制台，但是没有任何内容打印到控制台。

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Spotify</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<main class="main-container">

    <div class="header">
    <p>TrackSelector</p>
    </div>
    <section>
        <div class="form">
        <form action="">
    <input type="textt" class="track" placeholder="Enter track..." />
    <input type="texta" class="artist" placeholder="Enter artist..." />   
    <button type="button" class="submit-btn">GO</button>
            </form>
            </div>
    </section>

</main>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="script.js"></script>
</body>
</html>

Javascript file: Javascript文件：

const app = {};

//Allow the user to enter names

app.events = function() {
    $('form').on('button', function(e){
        e.preventDefault();
        let tracks = $('input[type=textt]').val();
        let artists = $('input[type=texta]').val();
        console.log(tracks);
        console.log(artists);
    });
};

//

//

app.init = function(){
    app.events();

};

$(app.init);

I believe I have specified to take in the correct inputs and specified the correct button reference, have played around to try out other methods but I'm still quite stuck... any ideas? 我相信我已经指定接受正确的输入并指定了正确的按钮引用，已经尝试了其他方法，但是我仍然很困惑……有什么想法吗？

Answer 1

Replace 更换

$('form').on('button', function(e){

with 与

$('form .submit-btn').on('click', function(e){

jQuery .on() expects event name as its first argument. jQuery .on()事件名称作为其第一个参数。

Answer 2

There is no input type type="textt" and texta . 没有输入类型type="textt"和texta 。 There are only predefined types like text, email, password, checkbox and so on... So make type "text" in both inputs and for reference use id: <input id="my_track" type="text"> . 只有预定义的类型，例如文本，电子邮件，密码，复选框等等。因此，请在两个输入中都输入类型“ text”，以供参考，请使用id： <input id="my_track" type="text"> 。 Then in javascript get value by $('#my_track').val(); 然后在javascript中通过$('#my_track').val();获取值$('#my_track').val(); To handle submit use $('form').on('submit', func) 使用$('form').on('submit', func)处理提交

如何获取JavaScript将文本输入打印到控制台

问题描述

2 个解决方案

解决方案1
0 2017-04-08 21:09:52

解决方案2
-1 2017-04-08 21:12:09

如何获取JavaScript将文本输入打印到控制台

问题描述

2 个解决方案

解决方案1 0 2017-04-08 21:09:52

解决方案2 -1 2017-04-08 21:12:09

解决方案1
0 2017-04-08 21:09:52

解决方案2
-1 2017-04-08 21:12:09