Как стиль DIV, когда идентификатор включает строки в php?

Как использовать CSS или jQuery для стилизации моего цвета фона в DIV, когда идентификатор включает строки в php?

Мой код:

<div id='result_'.$item_id.'>item</div>

person conan    schedule 16.02.2015    source источник
comment
вы хотите изменить фон, если $item_id != ''?   -  person Luca Olivieri    schedule 16.02.2015
comment
Я хочу изменить $item_id=что-то. Как и в Facebook, я считаю, что их ‹div› будет иметь идентификатор, например id=style'.$user_id.'› Итак, как они могут стилизовать его, когда у них другой пользователь. Потому что я не могу сказать result_'.$item_id.' в моем листе css, потому что он не займет $item_id. Спасибо за ваше время   -  person conan    schedule 16.02.2015


Ответы (3)


Вы можете прикрепить класс к своему div и использовать селектор jquery, чтобы получить свой div (по идентификатору или классу) и изменить его свойства css, используя .css(). Также я думаю, что вы хотите изменить фон после нажатия на определенный div, поэтому вам нужно также прикрепить обработчик кликов, извлечь его идентификатор, а затем изменить цвет фона.

<div class="my_class" id='result_'.$item_id.'>item</div>


   $(".my_class").click(function(event){
        var clicked_id_item = $(event.target).attr("id").split("_").pop();
        $("#result_"+clicked_id_item).css('background-color','black')   
    })
person levi    schedule 16.02.2015
comment
Спасибо за ваш ответ. Но число item_id будет варьироваться в зависимости от предмета, если у меня есть сотни тысяч предметов, что я могу сделать. Я не могу ввести #result_2, #result_3....... - person conan; 16.02.2015
comment
@conan хорошо, но это зависит от тебя, когда ты хочешь изменить фон? на основании чего? - person levi; 16.02.2015
comment
Вы хотите изменить все фоны div? или просто странные? или что? - person levi; 16.02.2015
comment
Может быть, мне не следует использовать ‹div›, я должен использовать ‹span› или что-то еще. я разрешаю другому пользователю вводить элемент, и я разрешаю пользователю удалять их, поэтому мне нужен другой идентификатор для другого элемента, поэтому я помещаю $item_id в ‹div›, поэтому всякий раз, когда пользователь щелкает этот элемент, он только ответ на этот конкретный идентификатор, но я не знаю, как стилизовать div, когда в нем есть $, спасибо за ваше время - person conan; 16.02.2015
comment
@conan Итак, вы хотите изменить цвет фона div, когда пользователь нажимает на него? - person levi; 16.02.2015
comment
Да, но на основе другого элемента. Если я нажму на элемент1, изменится элемент1, если я нажму на элемент2, изменится только элемент2. Но у меня тысячи элементов, поэтому я добавляю $item_id в div. поэтому $time_id будет меняться в зависимости от ситуации, которую я командую - person conan; 16.02.2015
comment
@conan проверь еще раз мой ответ. - person levi; 16.02.2015
comment
@conan, вы можете установить его как правильный ответ, нажав на галочку. - person levi; 16.02.2015
comment
@levi Не могли бы вы просто добавить простой класс к элементу, по которому щелкнули, как в моем примере? - person Jack; 16.02.2015

Если вы можете просто добавить класс в свой div, вы можете стилизовать его с помощью css:

<div class="my-class" id='result_'.$item_id.'>item</div>

CSS:

.my-class {
    background-color: red;
}

Или, если вы хотите обернуть свои div .wrapper, ваш css может выглядеть примерно так:

.wrapper > div {
    background-color: red;
}

редактировать

Из других ваших комментариев я вижу, что вы спрашиваете об изменении цвета фона при нажатии на div. Хотя в вашем вопросе это не было ясно, вы можете сделать это следующим образом: (Основываясь на моем предыдущем примере)

.my-class.active {
    background-color: blue;
}

Добавьте немного jquery:

$(".my-class").click(function(){
    $(this).siblings(".active").removeClass("active"); // Maybe you could use .end() to keep the chain going
    $(this).addClass("active");
});
person Jack    schedule 16.02.2015
comment
Спасибо за ваше время. Вы работаете, что я прошу. Ваш путь прост и велик. Но когда я комбинирую свои коды с другими, я думаю, что мне подходит подход levi's. - person conan; 16.02.2015

Вы можете использовать селектор атрибутов для идентификатора атрибута!

[id] соответствует каждому элементу с атрибутом "id".

[id=blah] эквивалентен селектору #blah (каждый элемент с id="blah").

И [id^=blah] соответствует каждому элементу, чей атрибут "id" начинается с blah.

[id^=result_] {
  background: hotpink;
  color: #fff;
}

div { margin: .2em; padding: .2em; }
<div id="result_blablah">#result_blablah</div>
<div id="result_hello">#result_hello</div>
<div id="nanana">#nanana</div>
<div class="plop">.plop</div>

person Aghaa    schedule 16.02.2015