Форум

aalegz · #1 (**permalink**) 17.06.2017, 00:00

Задача состоит в том, что бы в зависимости от параметра, прописанного в UTM форма на сайте отображалась или скрывалась. В JS совсем ничего не понимаю, поэтому пишу почти наугад. Просьба знатоков подсказать решение данной проблемы. На данный момент вариант такой:

Ссылка: https://www.example.com/?utm_source=mywebsite

Решение:

header form#al-form {
    if (source == mywebsite){
    display: none;
    } else {
        display: inline-block;
    }
    position: relative;
    width: 320px;
    background: #50251a;
    padding: 25px 25px 40px;
    border-top-left-radius: 30px;
    border-top-right-radius: 30px;

Оригинальный код:

header form#al-form {
    display: inline-block;
    position: relative;
    width: 320px;
    background: #50251a;
    padding: 25px 25px 40px;
    border-top-left-radius: 30px;
    border-top-right-radius: 30px;

Огромное спасибо за ответы.

j0hnik · #2 (**permalink**) 17.06.2017, 00:17

<head>
	<meta charset="utf-8">
</head>
<body>
	<script>
	var a = location.href.split("=");
	if (a[a.length - 1] == "mywebsite") document.getElementById("al-form").style.display = 'none';
	</script>
</body>

не советую

aalegz · #3 (**permalink**) 17.06.2017, 00:29

Сообщение от j0hnik

<head>
	<meta charset="utf-8">
</head>
<body>
	<script>
	var a = location.href.split("=");
	if (a[a.length - 1] == "mywebsite") document.getElementById("al-form").style.display = 'none';
	</script>
</body>

не советую

Что-то не получается((
Нужно просто вставить этот фрагмент в код, открыть индекс в браузере и добавить UTM? Или еще дополнительные манипуляции требуются?

j0hnik · #4 (**permalink**) 17.06.2017, 00:34

Сообщение от aalegz

Что-то не получается((
Нужно просто вставить этот фрагмент в код, открыть индекс в браузере и добавить UTM? Или еще дополнительные манипуляции требуются?

вставить перед </body> но будет работать только если страница загружается с данным параметром.
Было бы больше информации или макет, подсказали бы адекватное решение, а это так первое что в голову пришло.

<script>
	var a = location.href.split("=");
	if (a[a.length - 1] == "mywebsite") document.getElementById("al-form").style.display = 'none';
	</script>

laimas · #5 (**permalink**) 17.06.2017, 01:10

Сообщение от aalegz

if (source == mywebsite){
display: none;
} else {
display: inline-block;
}

Это как "влезть" в CSS процессор с JS? )

Такое можно сделать на сервере, проверив GET параметры запроса - если есть ключ/значение определенное, то прописать соответствующий стиль в теле документа.

aalegz · #6 (**permalink**) 17.06.2017, 20:38

Сообщение от j0hnik

вставить перед </body> но будет работать только если страница загружается с данным параметром.
Было бы больше информации или макет, подсказали бы адекватное решение, а это так первое что в голову пришло.

<script>
	var a = location.href.split("=");
	if (a[a.length - 1] == "mywebsite") document.getElementById("al-form").style.display = 'none';
	</script>

К сожалению, не сработал данный пример. Залил на хостинг, все сделал как нужно и ничего((
Возможно, есть еще какие-то решения?

j0hnik · #7 (**permalink**) 18.06.2017, 00:42

<script>
  var a = location.href;
  if (a.match(/mywebsite/) document.getElementById("al-form").style.display = 'none';
</script>

Попробуйте так

aalegz · #8 (**permalink**) 18.06.2017, 12:07

Сообщение от j0hnik

<script>
  var a = location.href;
  if (a.match(/mywebsite/) document.getElementById("al-form").style.display = 'none';
</script>

Попробуйте так

В чем может быть причина, если не работает и в таком виде?

<script>
document.getElementById("al-form").style.display = 'none';
</script>

j0hnik · #9 (**permalink**) 18.06.2017, 13:20

Сообщение от aalegz

В чем может быть причина, если не работает и в таком виде?

<script>
document.getElementById("al-form").style.display = 'none';
</script>

1)проверьте правильность id у элемента.
2)скрипт должен подключаться в конце документа.
консоль вам в помощь

aalegz · #10 (**permalink**) 18.06.2017, 21:52

Сообщение от j0hnik

1)проверьте правильность id у элемента.
2)скрипт должен подключаться в конце документа.
консоль вам в помощь

Спасибо большое, помог вариант ниже, проблема была в том, что добавлял код в начале Боди, а заработало когда добавил в конце.

script>
    var a = location.href.split("=");
    if (a[a.length - 1] == "mywebsite") document.getElementById("al-form").style.display = 'none';
    </script>

Форум

Справочник

Discord чат

Курсы javascript