Как да създадете генератор на javascript изречения (или абзаци)?

Как мога да създам генератор на javascript изречения (или абзаци)?

Създадох генератор, който генерира една оферта наведнъж, когато щракнете върху бутон. Цитатът се показва в текстово поле в 2 полета.

Но проблемът ми е, че може да показва само един цитат наведнъж. Искам да мога да смесвам няколко полуфрази, за да направя абзац.

(ie.)

| Колата | е синя. | Колата | е бърз. |

и друг резултат би бил:

|Колата | е зелено. | Колата | е бързо.|

  • това, което е между "|" са различните резултати.

P.s. Също така искам всичко да бъде в едно текстово поле и генерирано чрез щракване на бутон. Направих малко кодиране. Искам да го променя, за да направя възможен генератор на параграфи.

Оригинален код:

CSS

<style>
div#box{
height : 330px;
width : 450px;
background-color : teal;
border : 1px solid black;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
border-bottom-left-radius : 10px;
border-bottom-right-radius: 10px;
margin : 0px auto;}

 div#box2{
 height : 300px;
 width : 430px;
 background-color : brown;
 border : 1px solid black;
 border-top-left-radius: 10px;
 border-top-right-radius: 10px;
 border-bottom-left-radius : 10px;
 border-bottom-right-radius: 10px;
 margin : 0px auto;
 margin-top: 15px;} 

div#boxTitle{
height : 60px;
width : 390px;
background-color : olive;
color : teal;
font-family : times new roman;
font-size : 15pt;
letter-spacing : 1px;
border : 1px solid black;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
border-bottom-left-radius : 10px;
border-bottom-right-radius: 10px;
text-decoration : bold;
text-transform : uppercase;
text-align : center;
margin : 0px auto;
margin-top : 13px;}


textarea{
height : 200px;
width : 390px;
background-color : olive;
color : black;
font-family : arial new, cursive, serif;
font-size : 11pt;
letter-spacing : 3px;
border : 1px solid black;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
border-bottom-left-radius : 10px;
border-bottom-right-radius: 10px;
text-decoration : italic;
text-align : center;
margin-left : 5%;
margin-right : 5%;
margin-top : 20px;} 

.button{
height : 40px;
width : 175px;
background-color : teal;
color : #bbb;
font-family : arial new;
font-size : 12pt;
border : 1px solid black;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
border-bottom-left-radius : 10px;
border-bottom-right-radius:     10px;
text-decoration : bold;
text-align : center;
margin-left: 50%;}
</style>  

Javascript

 <script type="text/javascript"> 
 var Quotes = new Array(); 

 Quotes[0]="your first quote.";
 Quotes[1]="your second quote. "; 
 Quotes[2]="your third quote.  "; 


function getQuote(){ var seed      = Math.floor(Math.random() * 
Quotes.length); return     Quotes[seed]; } 

 </script>

HTML

  <div id="box">
 <div id="box2">
 <div      id="boxTitle"><br>generator      title</div>
 <textarea id="quoteBody"></textarea>
 </div></div>

  <br><br>
  <input type="button"    class="button" value="Get a   new quote"    onclick="document.   getElementById('quoteBody').  innerHTML = getQuote();" /> 

person user2805239    schedule 15.10.2013    source източник
comment
Променете функцията, така че да й подадете масива, от който да получите фраза. Извикайте го веднъж за всеки масив, свържете резултатите.   -  person RobG    schedule 15.10.2013


Отговори (2)


Може би нещо подобно

<script type="text/javascript"> 
 var nouns = ["car","horse","apple","person","chimp"];
 var adjectives = ["red","fast","lonely","hungry","insane"];

function getQuote(){ 
var randomNounIndex      = Math.floor(Math.random() * nouns.length);
var randomAdjectiveIndex = Math.floor(Math.random() * adjectives.length);
var retVal="The "+nouns[randomNounIndex]+" is "+adjectives[randomAdjectiveIndex]+".";
return retVal;
} 
</script>

След като схванете идеята, можете да я промените, за да върне всякакъв вид сложни изречения, съдържащи повече думи, части на речта и т.н.

person chiliNUT    schedule 15.10.2013

Можете да опитате нещо общо като:

// Return a random element of an array
function getRandomElement(arr) {
  return arr[Math.random() * arr.length | 0];
}

// Return a string of elements chosen randomly from a sequence of arrays
function genPhrase() {
  var phrases = [
     ['Huge','Extraordinary','Average','Amazing'],
     ['Intelligence','Ignorance','Mediocraty','Courage', 'Cowardice']
  ];
  var phrase = [];
  phrases.forEach(function(a) {phrase.push(getRandomElement(a));});
  return phrase.join(' ');
}

// Just for play..   
for (var i=5; i; i--) {
  document.write(genPhrase() + '<br>');
}

Имайте предвид, че forEach изисква поддръжка на ES5. Тривиално за замяна с for цикъл, ако е необходимо.

person RobG    schedule 15.10.2013