Results 1 to 2 of 2

Thread: Help with Quotes, random and number

  1. #1
    Join Date
    Oct 2016
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Help with Quotes, random and number

    Hello All. I need to use jquery to post quotes between each box on a page. The quotes are coming from a data source. The amount of quotes posted between the boxes will vary depending on the amount of boxes. Example. If there are only 3 boxes on a page then I only need to post two quotes, on in the space between each box. The number of boxes will vary, so the number of posts displayed will change as well.

    I have a plunker at
    https://plnkr.co/edit/5FUiNa0G5XoXEWsj2HxK?p=preview

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,374
    Thanks
    77
    Thanked 3,421 Times in 3,382 Posts
    Blog Entries
    12

    Default

    First of all you have several typos on the word quote:

    Code:
      $.getJSON('qoutes.json', function(data){
         alert('got it!')
        
      })
    Also within that file:

    Code:
    {
      "quotes":[
        {
          "qoute": "To be or not to be, that is the question"
          
        },
        
        {
          "qoute": "It is better to have lived and loved, than to not have lived at all"
          
        },
        
        {
          "qoute": "Loose lips, sink ships"
          
        }
        
        
        ]
      
    }
    Those kinds of things can really mess up code. Once I straightened that out, this seemed workable:

    Code:
    <!DOCTYPE html>
    <html>
    <head>
    <title>Quotes Demo</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <style>
    .qbox{color:red}
    .quote{color:blue;}
    </style>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
    <script>
    jQuery(function($){ /* same as document ready */
    	var $div = $('<div>', {class: 'quote'}).append('<p>'), qs, ql, idx;
    	function sf(){return 0.5 - Math.random();}
    	$.getJSON('quotes.json', function(data){
    		qs = data.quotes; ql = qs.length;
    		$('.qbox').each(function(i, qb){
    			!(idx = i % ql) && qs.sort(sf);
    			$div.clone().find('p').text(qs[idx].quote).end().insertAfter(qb);
    		});
    	});
    });
    </script>
    </head>
    <body>
    <div class="qbox">
    This is box 1 
    </div>
    
    <div class="qbox">
    This is box 2 
    </div>
    
    <div class="qbox">
    This is box 3
    </div>
    
    <div class="qbox">
    This is box 4 
    </div>
    
    <div class="qbox">
    This is box 5 
    </div>
    </body>
    </html>
    Last edited by jscheuer1; 10-12-2016 at 03:47 PM. Reason: code improvement
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

Similar Threads

  1. Random Quotes viewer
    By nawafpower in forum Dynamic Drive scripts help
    Replies: 2
    Last Post: 03-19-2012, 10:39 PM
  2. Random Quotes Script Needed
    By ArnyVee in forum Looking for such a script or service
    Replies: 1
    Last Post: 05-04-2011, 01:59 PM
  3. Script to show random quotes
    By Ryan Fitton in forum Looking for such a script or service
    Replies: 8
    Last Post: 12-29-2007, 02:41 PM
  4. single quotes & double quotes insert into mysql
    By shyne in forum MySQL and other databases
    Replies: 3
    Last Post: 11-25-2007, 09:18 PM
  5. Random Number
    By Rockonmetal in forum PHP
    Replies: 5
    Last Post: 09-16-2007, 09:30 PM

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •