Переменная в скрипте зависит от пользовательского ввода текстового поля

Я пытаюсь обновить var zz ниже тем, что пользователь вводит в текстовую область, когда попадает в submit. Идея состоит в том, чтобы создать базовое облако слов, используя слова, которые пользователь представляет в форме.Переменная в скрипте зависит от пользовательского ввода текстового поля

<!DOCTYPE html> 
<meta charset="utf-8"> 
<script src="../lib/d3/d3.js"></script> 
<script src="../d3.layout.cloud.js"></script> 
<body> 
<script> 
var fill = d3.scale.category20(); 
var zz= ["Hello", "world", "normally", "you", "want", "more", "words", "than", "this"]; 
d3.layout.cloud().size([300, 300]) 
    .words((zz).map(function(d) { 
     return {text: d, size: 10 + Math.random() * 90}; 
    })) 
    .rotate(function() { return ~~(Math.random() * 2) * 90; }) 
    .font("Impact") 
    .fontSize(function(d) { return d.size; }) 
    .on("end", draw) 
    .start(); 
........ 
</script> 

<div style="text-align: center"> 
<div id="presets"></div> 
<div id="custom-area"> 
    <p><label for="text">Enter some text.</label> 
    <p><textarea id="text"></textarea> 
    <button id="zz" type="submit">Go!</button> 
</div> 
</div>

источник

2013-11-10 user2975244

Оцените значение textarea при отправке или нажатии кнопки, разделите его пробелом и установите для результата 'zz'. – helion3

Когда форма представляет, или кнопка нажата, принимает значение поля и split пробелами:

Основываясь на вашем примере веб-страницы, вы имели несколько вопросов:

x не был определен, я получил сообщение об ошибке в консоли
я не видел какого-либо элемента с идентификатором demo, в вашем JavaScript

Here's a fiddle that shows a simple demo.

function myFunction(){  
    var zz = document.getElementById("text").value.split(" "); 
    document.getElementById("demo").innerHTML = zz; 
}

источник

2013-11-10 01:44:31 helion3

Большое спасибо за быстрый ответ - я все еще не совсем там. Не могли бы вы взглянуть на это: http://jingletree.com/d3-cloud-master/examples/simple.html – user2975244

Обновленный ответ с немного дополнительной информацией. Если вы 'console.log (zz)', вы увидите, что это фактически массив, несмотря на то, как он может появиться в HTML. – helion3

Я думаю, что я следую тому, что вы говорите, но все еще не получаете результатов. Я обновил страницу, если вы хотите снова взглянуть на нее. Большое спасибо за помощь! – user2975244

Переменная в скрипте зависит от пользовательского ввода текстового поля

ответ

Смежные вопросы