Javascript:如何将用户输入数据并将其转换为对象?

时间:2015-10-22 00:50:16

标签: javascript html

我有一个待办事项列表,我希望我可以通过html文本框接收用户输入。单击按钮后,信息当前以无序列表形式打印在这些文本框下。

它不完美,我说跳过了一步,我想用按钮点击用户输入的字符串,然后将它们添加到此功能。

function task(task_text, date, time) 

这当然的目的是稍后在整个代码中交换对象属性。

那么,我如何在文本框中获取信息并点击按钮将其提交给上述功能?

小提琴http://jsfiddle.net/brendanjackson/j501hc1k/1/

2 个答案:

答案 0 :(得分:1)

获取输入onclick

要将此输入输入到该功能中,您必须侦听onclick事件。

var input_text = document.getElementById('input_text').value;
var input_date = document.getElementById('input_date').value;
var input_time = document.getElementById('input_time').value;

onclick="task(input_text, input_date, input_time);"

如何将用户输入数据并将其转换为对象?

调用函数后,可以从传入的数据中创建一个对象,如下所示:

var inputs = [];
function task(task_text, date, time) {
    input.push({
        task_text: task_text,
        date: date,
        time: time
    });
}

或者如果您只打算接受一个输入,您可以这样做:

var obj = {};
function task(task_text, date, time) {
    obj.task_text: task_text,
    obj.date: date,
    obj.time: time
}

答案 1 :(得分:1)

小提琴:http://jsfiddle.net/KyleMuir/3rh4u7qu/1/

我认为这就是你所追求的:

function task(text, date, time) {
    this.text = text;
    this.date = date;
    this.time = time;
}

function buttonClicked() {
    var myText = document.getElementById('myText');
    var input_text = document.getElementById('input_text').value  ;
    var input_date = document.getElementById('input_date').value  ;
    var input_time = document.getElementById('input_time').value  ;
    var item = new task(input_text, input_date, input_time);
        myText.innerHTML += "<li>"+item.text+" "+item.date+" "+item.time+"</li>";
}

此外,在这里添加了一个稍微有趣的任务对象用法,从学习角度来看可能很有用:http://jsfiddle.net/KyleMuir/3rh4u7qu/2/