2015-08-09 3 views
0

Это мой код:кнопка оповещения не отвечает

<!DOCTYPE html> 
<html> 
    <head> 
    <title>Project 506</title> 
    <link rel="stylesheet" href="" type="text/css" /> 
    <script type="text/javascript" src="sweetalert.min.js"></script> 
    <style type="text/css"> 
     body { 
     text-align: center; 
     } 
    </style> 
    <script type="text/javascript"> 
     $(document).ready(function() { 
     $("#first").click(function() { 
      alert("Oops...", "Something went wrong!", "error"); 
     }); 
    }); 
    </script> 
    </head> 
    <body> 
    <h1>Message Boxes</h1> 
    <input type="button" id="first" value="Just a Notification" /> 
    <input type="button" id="second" value="Successfully Completed!" /> 
    <input type="button" id="third" value="Something Went Wrong!" /> 
    </body> 
</html> 

Как я могу показать окно предупреждения, когда я нажал на #first? Я не уверен, что не так с этим кодом.

Спасибо за помощь.

+2

Когда вы задавали ваш вопрос, был большой оранжевый ** Как форматировать ** поле справа от текстовой области с полезной информацией в нем. Была также вся панель инструментов форматирования. И кнопка ** [?] ** дает возможность форматирования. * И * область предварительного просмотра, расположенная между текстовой областью и кнопкой «Опубликовать свой вопрос» (чтобы вам пришлось просканировать ее, чтобы найти кнопку), показывающую, как будет выглядеть ваше сообщение при публикации. Четкость вашего сообщения и демонстрация того, что вы нашли время для этого, улучшают ваши шансы получить хорошие ответы. –

+0

Как и выше, теперь, когда вопрос отформатирован правильно, очевидно, что вы не включили библиотеку jQuery. – CodingIntrigue

+1

Если вы хотите использовать jQuery, вы должны включить его. Пожалуйста, прочитайте учебник jQuery (https://learn.jquery.com/about-jquery/how-jquery-works/). –

ответ

2

Вы забыли добавить библиотеку jquery в свой код. Вам нужно включить скрипт jquery в свой код внутри головы или тела, чтобы заставить ваш код работать.

Jquery

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

только один аргумент разрешен в функции alert(). Если вы используете несколько аргументов, будет использоваться первый аргумент перед запятой.

Вот код

alert("Oops...", "Something went wrong!", "error"); //this will alert oops.. 

Обновленного код

alert("Oops...Something went wrong! error"); 

Я видел ваше использование сладкого alert.js в вашем коде. Если вы хотите использовать sweetalert вместо собственного окна оповещения. Вам нужно заменить код следующим. Запятые допускаются в сладком начеку

sweetAlert("Oops...", "Something went wrong!", "error"); 

Смотрите обновленный код :) :)

<!DOCTYPE html> 
<html> 
<head> 
    <title>Project 506</title> 
    <link rel="stylesheet" href="" type="text/css" /> 

    <script type="text/javascript" src="sweetalert.min.js"></script> 
    <style type="text/css"> 
    body { 
    text-align: center; 
    } 
    </style> 
    <script type="text/javascript"> 
     $(document).ready(function() { 
      $("#first").click(function() { 
       alert("Oops...Something went wrong! error"); 
      }); 
     }); 
    </script> 
</head> 
<body> 
    <h1>Message Boxes</h1> 
    <input type="button" id="first" value="Just a Notification" /> 
    <input type="button" id="second" value="Successfully Completed!" /> 
    <input type="button" id="third" value="Something Went Wrong!" /> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
</body> 
</html> 

ВИДЕТЬ Js скрипку JSFIDDLE

+0

Большое спасибо, это очень помогло! –

+0

* «Вы не можете поместить запятую внутри функции native alert(). Разрешен только один аргумент.» * Ну, вы, конечно, разрешены *, чтобы это сделать, оно просто игнорирует любой, кроме первого аргумента. –

+0

принимает только один аргумент, это означает, что более 1 не разрешено ... если вы добавите более 1-го аргумента, будет использоваться, а остальные аргументы будут проигнорированы, @FelixKling –

1

Библиотека jQuery отсутствует внутри основного тега вашего HTML-документа. включают между <head> и </head> теги.

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

Ваш HTML файл должен выглядеть следующим образом:

<!DOCTYPE html> 
<html> 
<head> 
    <title>Project 506</title> 
    <link rel="stylesheet" href="" type="text/css" /> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
    <script type="text/javascript" src="sweetalert.min.js"></script> 
    <style type="text/css"> 
    body { 
    text-align: center; 
    } 
    </style> 
    <script type="text/javascript"> 
     $(document).ready(function() { 
      $("#first").click(function() { 
       alert("Oops...", "Something went wrong!", "error"); 
      }); 
     }); 
    </script> 
</head> 
<body> 
    <h1>Message Boxes</h1> 
    <input type="button" id="first" value="Just a Notification" /> 
    <input type="button" id="second" value="Successfully Completed!" /> 
    <input type="button" id="third" value="Something Went Wrong!" /> 
</body> 
</html> 
+0

Конечно, проверьте подходящую версию JQuery по адресу https://code.jquery.com/ – scarto

0

Вы излишне положить запятые вне строки кавычки в боевой готовности. Также вы можете написать код сценария перед закрытием тег тела вместо того, чтобы писать его в заголовках . Это определенно сработает.

$(document).ready(function() { 
     $("#first").click(function() { 
      alert("Oops... , Something went wrong! , error"); 
     }); 
}); 
Смежные вопросы