Все технические форумы на одном сайте Удобный поиск информации с популярных форумов в одном месте
Вопрос: чтение url(document.location) исходя из этого присвоение элементу класс

Приветствую всех!

В общем есть страница site.ru/blog
чтоб загорелся нужный пункт меню(навигация одна на весь сайт), в данном случае пункт меню blog( у него id=hsblog), я присваиваю ему класс activlink

if(document.location.pathname=="/blog"){
$("#hsblog").addClass("activlink");
};

и все четко работает, но есть страницы в блоге которые пишутся после блога слэшем, и их много на типа site.ru/blog/3458 или site.ru/blog/57899 и уже меню не загорается, потому что location.pathname другой.

Хотелось бы чтоб и на этих страницах подсвечивался тот же пункт меню blog, как в if это указать можно одной строкой?

Спасибо заранее.
Ответ: спасибо за первую подсказку(вторую не видел), решил с поиском подстроки так

var ft=window.location.toString();
var target = ft.indexOf("blog");
if(target!=-1){
$("#hsblog").addClass("activlink");
};
Вопрос: Не работает window.location

Вот пример кода:

<script language="JavaScript">

function selectChange() {
   alert("Переход");
window.location = "http://javascript.ru"
}
</script>
</head>
<body>

<form>
<input type="text" name="search1" onchange = "selectChange()"><br/>
</form>
<form>
	<select size="1" onchange = "selectChange()">
	<option value="1">проба</option>
	<option value="2">проверка</option>
	</select>
</form>


При выборе элемента из списка отрабатывается alert, и идет переход на . При вводе текста и нажатии enter отрабатывается alert, перехода на другую страницу нет. Может кто подскажет почему и как это исправить. При использовании document.location.href ситуации аналогичная.
Ответ: Правильней писать так:

window.location.href = 'http://javascript.ru';

Или

document.location.href = 'http://javascript.ru';

Но тут проблема в другом, как описал рони выше.

P.S.: а не проще ли просто задать форме action?

<form action="http://javascript.ru">
    <input type="text" name="search1">
	<select size="1" onchange="form.submit()">
	    <option value="1">проба</option>
	    <option value="2">проверка</option>
	</select>
</form>
Вопрос: location.href странно себя ведет во всех IE

На странице имеется <base href="http://site-name.ru/test/">
При document.location.href="search" со страницы http://site-name.ru/test переходит на http://site-name.ru/search. А вот со страниц типа http://site-name.ru/test/about переходит правильно, на http://site-name.ru/test/search. Так себя ведет только IE (причем любой версии), остальные браузеры любую другую ссылку обрабатывают, как задумано (т. е. при document.location.href="search" со страницы http://site-name.ru/test переходит на http://site-name.ru/test/search). Уже час бьюсь, не знаю даже, как грамотно вопрос гуглу задать, поэтому пишу сюда.
Ответ:
Сообщение от Deff
roxoman93,
1. Вы не говорили что есть jQuery ибо там просто мон создать тег <а>

$(function(){
   var b = $("<a>",{href:"."})[0].href;
   document.location.href = b + 'адрес';
});

Кроме <base href="http://site-name.ru/test/">
Есть и <base target="">
Есть уверенность что оно не стоит первым ?
И есть уверенность, что <base href="http://site-name.ru/test/"> единственное на странице ?
<base target=""> нету, <base href="http://site-name.ru/test/"> единственное.
Вопрос: присвоение двух классов

как лучше сделать если элементу нужно присвоить 2 класса?

1 вариант
Код CSS
1
2
3
4
5
6
.red, .redAndBig {color:darkred}
.big, .redAndBig {font-size:200%; font-weight:bold}
 
<p class="red">Красный.</p>
<p class="big">большой.</p>
<p class="redAndBig">Красный. И большой.</p>
2 вариант
Код CSS
1
2
3
4
5
6
.red {color:darkred}
.big {font-size:200%; font-weight:bold}
 
<p class="red">Красный.</p>
<p class="big">большой.</p>
<p class="red big">Красный. И большой.</p>
или лучше сделать отдельный класс этому элементу?

3 вариант
Код CSS
1
2
3
4
5
6
7
.red {color:darkred}
.big {font-size:200%; font-weight:bold}
.redAndBig {color:darkred: font-size:200%; font-weight:bold}
 
<p class="red">Красный.</p>
<p class="big">большой.</p>
<p class="redAndbig">Красный. И большой.</p>
Ответ: зачем одному тегу <div> присваивается два класса? <div class="first second"> ?
Вопрос: Перетаскивание элементов класса в jQuery

Здравствуйте. Окончательно запуталась. Подскажите в чём ошибка, что делаю не так. В Ява Скрипте новичок.

Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
<html>
<head>
<script type="text/javascript" src="js/jquery.min.js"></script>
  <title>ТЕСТ</title>
 
<body>
<div class="block" style="border: 1px solid #000; cursor: move; position: absolute">Перетащи меня</div>
</body>
 
<script type='text/javascript'>
$(document).ready(function(){
   var I = $("div.block"), l, t;
   $("I").mousedown(function(e){var e = e || window.event; 
   l = $(this).offset().left - (e.pageX || e.clientX),
   t = $(this).offset().top  - (e.pageY || e.clientY),
   mousemove(function(e){var e = e || window.event; with (this.style)
      cursor = 'grabbing', left = (l + (e.pageX || e.clientX)),
                           top  = (t + (e.pageY || e.clientY))
                           });
   mouseup(function(){this.style.cursor = this.mousemove = ''
   });
   });
});
</script>
</head>
</html>
Ответ:
Сообщение от Shock9777
Подскажите в чём ошибка
Ошибок тут много, если не сказать, что почти весь код одна большая ошибка. Попробуйте :
Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
$(function() {
  var move = false,
    posLeft,
    posTop,
    block = $("div.block").on('mousedown', function(e) {
      posLeft = e.pageX - parseInt($(this).css('left'), 10);
      posTop = e.pageY - parseInt($(this).css('top'), 10);
      move = true;
    });
  $(document).on({
    mousemove: function(e) {
      if (move) {
        block.css({
          left: (e.pageX - posLeft),
          top: (e.pageY - posTop),
        });
      }
    },
    mouseup: function() {
      move = false;
    }
  });
});
Вопрос: Поиск и удаление второго элемента класса

Здравствуйте!

Есть задачка: На странице имеются дубли материалов, например:

<section class="ya001"></section>
<section class="ya003"></section>
<section class="ya002"></section>
<section class="ya001"></section>
<section class="ya005"></section>
<section class="ya002"></section>
<section class="ya007"></section>

Есть ли какая-нибудь возможность с помощью скрипта отыскивать вторые элементы данного класса и удалять их? То бишь удалять дубли.
Ответ:
Сообщение от Nezumi.May
Доступа к серверу нет, увы.
Это как понимать?
Вопрос: Работает только в эксплорере(вывод св-в document)

Подскажите, пожалуйста, как сделать так, чтобы работало не только в IE, но и в других браузерах.

Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
<!Doctype html>
<html>
<title>Свойства объекта Document</title>
    <script language="javascript">
        function func(){
            var bgc = document.bgColor;
            var fgc = document.fgColor;
            var lc = document.linkColor;
            var al = document.alinkColor;
            var vlc = document.vlinkColor;
            var url = document.location;
            var ref = document.referrer;
            var t = document.title;
            var lm = document.lastModified;
            document.write("Цвет фона этой страницы <B>"+ bgc + "</B>.");
            document.write("<br>Цвет текста этой страницы <B>" + fgc + "</b>.");
            document.write("<br>Цвет ссылок этой страницы <b>" + lc + "</b>.");
            document.write("<br>Цвет активной ссылки этой страницы <B>"+ al +"</b>.");
            document.write("<br>Цвет посещенной ссылки этой страницы <B>"+ vlc +"</b>.");
            document.write("<br>URL этой страницы <B>" + ref + "</b>.");
            document.write("<br>До этого вы были на странице <B>"+ ref +"</b>.");
            document.write("<br>Заголовок этой страницы <B>"+ t +"</b>.");
            document.write("<br>Последние изменения в документ внесены: <b>"+lm+"</b>");
        }
    </script>
<body>
    <button onClick="func()">Кнопка</button>
</body>
</html>
</html>
Ответ: не.
я вот про это
HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
<head>
    <title>Свойства объекта Document</title>
    <script language="javascript">
    
            function func() {
                var body = document.getElementsByTagName('body')[0];
                var a = document.createElement( 'a' );
                body.appendChild( a );
                a.style.display = 'none';
      
                var bgc =  window.getComputedStyle(body, null).getPropertyValue("background-color");
                var fgc =  window.getComputedStyle(body, null).getPropertyValue("color");
                var lc =  window.getComputedStyle(a, null).getPropertyValue("color");
                var al =  window.getComputedStyle(a, ':active').getPropertyValue("color");
                var vlc =  window.getComputedStyle(a, ':visited').getPropertyValue("color");
 
                var url = document.location;
                var ref = document.referrer;
                var t = document.getElementsByTagName('title')[0].innerHTML;
                var lm = document.lastModified;
                document.write("Цвет фона этой страницы <B>"+ bgc + "</B>.");
                document.write("<br>Цвет текста этой страницы <B>" + fgc + "</b>.");
                document.write("<br>Цвет ссылок этой страницы <b>" + lc + "</b>.");
                document.write("<br>Цвет активной ссылки этой страницы <B>"+ al +"</b>.");
                document.write("<br>Цвет посещенной ссылки этой страницы <B>"+ vlc +"</b>.");
                document.write("<br>URL этой страницы <B>" + ref + "</b>.");
                document.write("<br>До этого вы были на странице <B>"+ ref +"</b>.");
                document.write("<br>Заголовок этой страницы <B>"+ t +"</b>.");
                document.write("<br>Последние изменения в документ внесены: <b>"+lm+"</b>");
            }
    </script>
    <style>
        a {
            color: #00F;
        }
        a:active {
            color: #0F0;
        }
        a:focus {
            color: #5F5;
        }
        a:visited {
            color: rgb(249, 0, 0)
        }
        :visited {
            color: rgb(249, 0, 0)
        }
        * {
            color: #F0F;
        }
    </style>
</head>
<body style="background-color: #484848;">
    <button onClick="func()">Кнопка</button>
    <a active href="?p=2">...</a>
</body>
Добавлено через 30 секунд


Добавлено через 1 минуту
при этом как получить при :active и :visited не ясно
Вопрос: Добавление <div> элемента по щелчку

Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
elem.onclick = function (event) {
    
    if (!div) {
        
    var div = document.createElement("div");
    div.classList.add("alert");
    var parentElem = document.body;
    parentElem.appendChild(div);
    div = true;
    
    } else {
        
    parentElem.removeChild(div);
    
    }
    
}
По задумке при клике по элементу "elem" должен создаваться и помещаться на страницу контейнер <div> с классом "alert", а при повторном клике по этому же элементу контейнер <div> должен исчезать. Так выходит, что при первом клике на "elem" <div> создаётся, но при повторном клике этот <div> не исчезает. Подскажите, пожалуйста, в чём причина или предложите своё решение задачи с помощью js.
Ответ: stas31neo, код не работает из-за того что это условие
Javascript
1
2
3
 if (!div) {
        
    var div = document.createElement("div");
всегда true

читайте статью, которую я скинул
Вопрос: Как сделать, чтобы элемент удалял сам себя?

Создаю элемент
Javascript
1
2
3
a = document.body.createElement("p");
//тут настраиваю свойства;
document.appendChild(a);
А теперь как мне сделать, чтобы он удалял сам себя через какое-то время? При этом таких элементов будет много одновременно, поэтому удалять q нельзя. Я думал. нужно юзать что-то типа removeChild(this), но я не знаю, как это сделать. Помогите плиз.
Заранее спасибо!
Ответ: Попробуйте так:

PHPHTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>Йцукен</title>
<style>
a > b{
color:Crimson;
font-style:italic;
}
a > span{
color:Green;
letter-spacing:2px;
}
</style>
<script>
function El(tag,html,parent,removeIn){
this.tag=tag;
this.html=html;
this.parent=parent;
this.removeIn=removeIn;
this.show=function(){
var x=document.createElement(this.tag);
x.innerHTML=this.html;
x.setAttribute('style','display:inline-block;margin-left:20px');
eval('document.'+this.parent+'.appendChild(x)');
setTimeout(function(){x.parentNode.removeChild(x)}, removeIn);
}
this.show();
}
 
onload=function(){
var i=0;
while(i < 100){
var xyz=new El('a','<b>Boobies</b> make the <span>world</span> go round!','body',3000);
i++;
}
}
</script>
</head>
<body></body>
</html>
Вопрос: Поменять местами классы дивам

Добрый день уважаемые. Подскажите как решить такую задачу.

Есть такая разметка

<div id="full">
<div class="square Namber1">1</div>
<div class="square Namber2">2</div>
<div class="square Namber3">3</div>
</div>

По нажатию на один из элементов этого блока, этому диву прибавляется класс .circle (Допустим нажали на 1 получили <div class="square Namber1 circle"> )

Если нажимаем на тот же див, ничего не происходит.
Если ещё раз нажать на элемент из блока full (другой див, допустим 2 ) необходимо что б уже этому диву добавился класс circle (у изначального дива он убрался) и произошла замена классов Namber. То есть, у того изначального с классом circle стало Namber2 а у второго Namber1. Ну и так далие для других дивов, при нажатие происходило бы удаление и классы менялись бы местами.

Подскажите, пожалуйста.
Ответ:
Сообщение от Black_Star
что происходит здесь -
var e1=o1.get(0); /// Что здесь происходит ?
Мы берем первый элемент из выборки объектов ?
Не просто первый, но еще и "превращенный" в элемент ДОМ

Сообщение от Black_Star
и здесь
var c1=e1.className.match(/Namber\d+/)[0]; // Первый раз встречаюсь с таким className.match
что за зверь такой ?
Т.о. я узнаю какой именно класс из Namber* есть у элемента