Форум

DENERIK · #1 (**permalink**) 09.01.2015, 07:40

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

Нужно чтобы ссылка менялась при постановке и удалении галочек.

Вот код с двумя галочками:

<input type="checkbox" name="a1"><span title="...">Графа 1</span>
<input type="checkbox" name="a2"><span title="...">Графа 2</span>

Но как обработать: name="a1" и name="a2" я не знаю.

Подскажите пожалуйста.
Или дайте ссылку на статью по этому вопросу.

А то я гуглил. Но в результатах, замена URL, а не ссылки =(

Erolast · #2 (**permalink**) 09.01.2015, 08:22

Что за ссылка? На что меняться должна? Какой фреймворк используется?

DENERIK · #3 (**permalink**) 09.01.2015, 08:43

В идеале должно быть так;

Если галочки не установлены :

<a href="ССЫЛКА 1" download="download"><div class="a120"><p>СКАЧАТЬ</div></a>

Если установлена первая галочка :

<a href="ССЫЛКА 2" download="download"><div class="a120"><p>СКАЧАТЬ</div></a>

Если установлена вторая галочка :

<a href="ССЫЛКА 3" download="download"><div class="a120"><p>СКАЧАТЬ</div></a>

Если установлены обе галочки :

<a href="ССЫЛКА 4" download="download"><div class="a120"><p>СКАЧАТЬ</div></a>

.a120 {
width: 230px;
position: relative;
top: 70px;
left: 13px;
display: inline-table;
background: rgba(255, 255, 255, 0.3);
text-align: center;
font-size: 110%;
color: rgba(238,238,238,1);
text-shadow: 0px 0px 14px rgba(255, 255, 255, 1);
}

рони · #4 (**permalink**) 09.01.2015, 09:42

DENERIK,

<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  a  {
    display: none;

  }
 .a120 {
width: 230px;
position: relative;
top: 70px;
left: 13px;
display: inline-table;
background: rgba(255, 255, 255, 0.3);
text-align: center;
font-size: 110%;
color: rgba(0,0,0,1);
text-shadow: 0px 0px 14px rgba(255, 255, 255, 1);
}

  </style>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script>
 $(function() {
    var a = $('[name^="a"]'),
        b = $("a");
    a.click(function() {
        var c = 0;
        a.each(function(a, b) {
            this.checked && (c += a + 1)
        });
        b.hide().eq(c).show()
    });
    b.eq(0).show()
});
  </script>
</head>

<body>
<input type="checkbox" name="a1"><span title="...">Графа 1</span>
<input type="checkbox" name="a2"><span title="...">Графа 2</span>
<a href="ССЫЛКА 1" download="download"><div class="a120">СКАЧАТЬ1</div></a>
<a href="ССЫЛКА 2" download="download"><div class="a120">СКАЧАТЬ2</div></a>
<a href="ССЫЛКА 3" download="download"><div class="a120">СКАЧАТЬ3</div></a>
<a href="ССЫЛКА 4" download="download"><div class="a120">СКАЧАТЬ4</div></a>
</body>

</html>

DENERIK · #5 (**permalink**) 09.01.2015, 16:50

А "http://ajax.googleapis.com/ajax/libs.../jquery.min.js" это что ?

Erolast · #6 (**permalink**) 09.01.2015, 17:58

jQuery

DENERIK · #7 (**permalink**) 17.01.2015, 02:25

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

Форум

Справочник

Discord чат

Курсы javascript