Не работают кнопки...
Здравствуйте!
Учу jQuery по учебнику. Сам учебник не плохой и, я бы сказал, очень хорошо сделан. Просто я, наверное, не внимательный... В общем, есть такой скрипт:
$(document).ready(function () {
var v = f;
$('button #vegOn').click(function () {
if (v == false) {
$f = $(".fish").parent().parent().detach();
$m = $('.meat').detach();
$('.hamburger').replaceWith('<li class="portobello"><em>Portobello Mushroom</em></li>');
$('.meat').after('<li class="tofu"><em>Tofu</em></li>');
$('.tofu').parent().parent().addClass('veg_leaf');
v = true;
}
});
$('button #restorMe').click(function () {
if (v == true) {
$('.menu_entrees li').first().before($f);
$('.portobello').replaceWith('<li class="hamburger">hamburger</li>');
$('.tofu').each(function (i) {
$(this).after($m[i]);
});
$('.tofu').remove();
v = false;
}
});
});
Он должен, при нажатии кнопки, удалять/заменять некоторые элементы DOMа и, при нажатии другой кнопки, возвращать их. Судя по всему я что-то где-то не дообъявлял... Рассуждать особо не буду так как уже всё, что в моих силах, я проверил и это не помогло. Надеюсь на помощь знающих людей. |
Цитата:
|
Цитата:
|
drakulawz,
HTML где? |
Цитата:
http://javascript.ru/forum/misc/7486...tml#post492492 |
Хотел добавить архив со всеми файлами но пишет, что не верный файл, такое же пишет при прикреплении файлов по одному, сейчас добавлю как есть:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>test</title>
<link rel="stylesheet" href="style/normalize.css">
<link rel="stylesheet" href="style/clearfix.css">
<link rel="stylesheet" href="style/style.css">
<script src="script/jquery-3.3.1.js"></script>
<script src="script/script.js"></script>
</head>
<body>
<div id="menu_wraper">
<div id="topper">
<h2>Our Menu</h2>
<ul>
<li class="nav"><button id="vegOn">Go Vegetarian</button></li>
<li class="nav"><button id="restorMe">Restore menu</button></li>
</ul>
</div>
<h4>Dinner Entrees</h4>
<div class="left_col">
<ul class="menu_entrees">
<li>
<p>Thai-style Halibut</p>
<ul class="menu_list">
<li>coconut milk</li>
<li class="fish">pan-fried halibut</li>
<li>early autumn vegetables</li>
<li>Thai spices</li>
</ul>
</li>
<li>
<p>Braised Delight</p>
<ul class="menu_list">
<li class="meat">lamb shoulder</li>
<li>cippolini onions</li>
<li>carrots</li>
<li>baby turnip</li>
<li>braising jus</li>
</ul>
</li>
<li>
<p>House Grilled Panini</p>
<ul class="menu_list">
<li class="meat">prosciutto</li>
<li>provolone</li>
<li>avocado</li>
<li>sourdough roll</li>
</ul>
</li>
<li><p>House Slider</p>
<ul class="menu_list">
<li>eggplant</li>
<li>zucchini</li>
<li class="hamburger">hamburger</li>
<li>balsamic vinegar</li>
<li>onion</li>
<li>carrots</li>
<li>multigrain roll</li>
<li>goat cheese</li>
</ul>
</li>
<li>
<p>Southwest Slider</p>
<ul class="menu_list">
<li>whole chiles</li>
<li class="hamburger">hamburger</li>
<li>pepperjack cheese</li>
<li>multigrain roll</li>
</ul>
</li>
</ul>
</div>
<div class="right_col">
<ul class="menu_entrees">
<li>
<p>Frittata</p>
<ul class="menu_list">
<li class="meat">eggs</li>
<li>Asiago cheese</li>
<li>potatoes</li>
</ul>
</li>
<li>
<p>Coconut Soup</p>
<ul class="menu_list">
<li>coconut milk</li>
<li class="meat">chicken</li>
<li>vegetable broth</li>
</ul>
</li>
<li>
<p>Soup Du Jour</p>
<ul class="menu_list">
<li class="meat">grilled steak</li>
<li>mushrooms</li>
<li>vegetables</li>
<li>vegetable broth</li>
</ul>
</li>
<li>
<p>Hot and Sour Soup</p>
<ul class="menu_list">
<li class="meat">roasted pork</li>
<li>carrots</li>
<li>Chinese mushrooms</li>
<li>chili</li>
<li>vegetable broth </li>
</ul>
</li>
<li>
<p>Avocado Rolls</p>
<ul class="menu_list">
<li>avocado</li>
<li>whole chiles</li>
<li>sweet red peppers</li>
<li>ginger sauce</li>
</ul>
</li>
</ul>
</div>
</div>
</body>
</html>
|
Цитата:
А не вся твоя страница целиком. ;) |
Цитата:
Цитата:
|
Цитата:
Все сложное начинается с простого. Если сделал простое - начинай его усложнять. Иначе придется искать экстрасенсов или платить деньги за работу с твоим говнокодом. |
drakulawz,
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>test</title>
<style type="text/css">
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$(function () {
$('#vegOn').click(function () {
$('.hamburger').replaceWith('<li class="portobello"><em>Portobello Mushroom</em></li>');
$('.meat').each(function() {
var tofu = $('<li class="tofu"><em>Tofu</em></li>');
tofu.data('meat', $(this))
tofu.after(this);
$('.tofu').parent().parent().addClass('veg_leaf');
$(this).remove();
});
$(".fish").parent().parent().hide();
});
$('#restorMe').click(function () {
$('.portobello').replaceWith('<li class="hamburger">hamburger</li>');
$('.tofu').each(function () {
$(this).data('meat').after(this);
$(this).parent().parent().removeClass('veg_leaf');
$(this).remove();
});
$(".fish").parent().parent().show();
});
});
</script>
</head>
<body>
<div id="menu_wraper">
<div id="topper">
<h2>Our Menu</h2>
<ul>
<li class="nav"><button id="vegOn">Go Vegetarian</button></li>
<li class="nav"><button id="restorMe">Restore menu</button></li>
</ul>
</div>
<h4>Dinner Entrees</h4>
<div class="left_col">
<ul class="menu_entrees">
<li>
<p>Thai-style Halibut</p>
<ul class="menu_list">
<li>coconut milk</li>
<li class="fish">pan-fried halibut</li>
<li>early autumn vegetables</li>
<li>Thai spices</li>
</ul>
</li>
<li>
<p>Braised Delight</p>
<ul class="menu_list">
<li class="meat">lamb shoulder</li>
<li>cippolini onions</li>
<li>carrots</li>
<li>baby turnip</li>
<li>braising jus</li>
</ul>
</li>
<li>
<p>House Grilled Panini</p>
<ul class="menu_list">
<li class="meat">prosciutto</li>
<li>provolone</li>
<li>avocado</li>
<li>sourdough roll</li>
</ul>
</li>
<li><p>House Slider</p>
<ul class="menu_list">
<li>eggplant</li>
<li>zucchini</li>
<li class="hamburger">hamburger</li>
<li>balsamic vinegar</li>
<li>onion</li>
<li>carrots</li>
<li>multigrain roll</li>
<li>goat cheese</li>
</ul>
</li>
<li>
<p>Southwest Slider</p>
<ul class="menu_list">
<li>whole chiles</li>
<li class="hamburger">hamburger</li>
<li>pepperjack cheese</li>
<li>multigrain roll</li>
</ul>
</li>
</ul>
</div>
<div class="right_col">
<ul class="menu_entrees">
<li>
<p>Frittata</p>
<ul class="menu_list">
<li class="meat">eggs</li>
<li>Asiago cheese</li>
<li>potatoes</li>
</ul>
</li>
<li>
<p>Coconut Soup</p>
<ul class="menu_list">
<li>coconut milk</li>
<li class="meat">chicken</li>
<li>vegetable broth</li>
</ul>
</li>
<li>
<p>Soup Du Jour</p>
<ul class="menu_list">
<li class="meat">grilled steak</li>
<li>mushrooms</li>
<li>vegetables</li>
<li>vegetable broth</li>
</ul>
</li>
<li>
<p>Hot and Sour Soup</p>
<ul class="menu_list">
<li class="meat">roasted pork</li>
<li>carrots</li>
<li>Chinese mushrooms</li>
<li>chili</li>
<li>vegetable broth </li>
</ul>
</li>
<li>
<p>Avocado Rolls</p>
<ul class="menu_list">
<li>avocado</li>
<li>whole chiles</li>
<li>sweet red peppers</li>
<li>ginger sauce</li>
</ul>
</li>
</ul>
</div>
</div>
</body>
</html>
|
| Часовой пояс GMT +3, время: 08:38. |