2016-07-26 4 views
1

Даю. Кажется, я не могу заставить код jsfiddle работать, когда передаю его в Dreamweaver? Мне нужно пропустить что-то простое? Он отлично работает в jsfiddle. Я добавил готовую функцию, а не загрузку, но она все еще не работает.Перевод jsfiddle в Dreamweaver

$("document").ready(function() { 
 

 
     var h1 = $('div#greeting h1'); 
 

 
     h1.hide().contents().each(function() { 
 
     var words; 
 
     if (this.nodeType === 3) { 
 
      words = this.data.split(/\s+/).map(function(w) { 
 
      return '<span>' + w + '</span>'; 
 
      }).join(''); 
 
      $(this).replaceWith(words); 
 
     } else if (this.nodeType === 1) { 
 
      $(this).html($(this).html().split(/\s+/).map(function(w) { 
 
      return '<span>' + w + '</span>'; 
 
      }).join('')); 
 
     } 
 
     }); 
 

 
     h1.find('span').hide().each(function() { 
 
     if (!$.trim(this.innerHTML)) { 
 
      $(this).remove(); 
 
     } 
 
     }); 
 

 
     $('#start').on('click', function() { 
 
     h1.show().find('span').each(function(i, e) { 
 
      h1.queue(function(next) { 
 
      $.when($(e).fadeIn(150).fadeOut(150)).done(next); 
 
      }); 
 
     }); 
 
     }); 
 
     $('#stop').on('click', function() { 
 
     h1.finish(); 
 
     }); 
 
     $('#reset').on('click', function() { 
 
     h1.finish(); 
 
     });
.box { 
 
    border: 1px solid #E38E34; 
 
    background-color: #FFE7BF; 
 
    height: 150px; 
 
    -webkit-border-radius: 1px; 
 
    -moz-border-radius: 1px; 
 
    border-radius: 1px; 
 
} 
 
#title { 
 
    margin: 5px; 
 
    border-bottom: 1px solid #E38E34; 
 
    color: #C46908; 
 
    font-weight: bold; 
 
} 
 
#message { 
 
    margin: 5px; 
 
} 
 
h1 { 
 
    font-size: 50px; 
 
    text-align: center; 
 
}
<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 

 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
 

 
    <link rel="stylesheet" type="text/css" href="styles.css"> 
 

 
    <title>TedsCode</title> 
 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 

 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script> 
 

 
    <script type="text/javascript" src="speedread.js"></script> 
 
</head> 
 

 
<body> 
 
    <div class="box" /> 
 
    <div id="title"><span id="name">Title</span> 
 
    </div> 
 
    <div id="message" /> 
 
    <div id="greeting" /> 
 
    <input type="button" value="Read" id="start" /> 
 
    <input type="button" value="Stop" id="stop" /> 
 
    <input type="button" value="Reset" id="reset" /> 
 
    <h1><center>This is a test to see if this script displays one word at a time and functions correctly.</center></h1> 
 

 
</body> 
 

 
</html>

ответ

0

Вы хав синтаксической ошибки в JS.

Я прокомментирую что-то: добавьте "});" на js и удалить избыточную ссылку jquery.

Фрагмент кода теперь работает

+0

Wow, Dreamweaver должен был показать ошибку. Спасибо, он отлично работает. :) – user3457159

0

Я вижу две вещи: 1-Почему вы используете две версии JQuery в то же время, 1.9.1 и 2.1.0? 2-В коде вы вставляете, то $ («документ»). Готовы (функция() { не закрыта

Получаете ли вы какие-либо ошибки в консоли или в сети?

+0

Ничего себе, это не показало ошибку в Dreamweaver, удивительно, насколько это просто. Спасибо. – user3457159

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