UPDATE:链接到该网站http://lucasvallim.com/previews/example/servicos.html
我需要删除的DIV每.item_index里的所有ID和事后ID #servico_ativo添加到被点击的一个。
它只能使用一次,其他的点击将刚才添加的ID的被点击链接,不会再删除的ID ...
或者,如果可能的话,另一种解决方案是使用类,而不是身份证。 但在这种情况下,我会从所有项目里只删除类“servico_ativo”,然后这个相同的类添加到项目点击。
id为“servico_ativo”,增加了一个css来获取字体加粗,也是一个背景,以利项目,用户点击..它是相当简单,但我不使用jQuery那么好还。
所有的解决方案都欢迎。
任何建议?
$("a.click_assessoria").click(function(){
$(".conteudo_dinamico").empty()
$.get('assessoria.html', function(result) {
$('.conteudo_dinamico').append(result);
});
$(".item_index").removeAttr("id");
$(this).attr('id', 'servico_ativo');
});
$("a.click_projeto").click(function(){
$(".conteudo_dinamico").empty()
$.get('projeto.html', function(result) {
$('.conteudo_dinamico').append(result);
});
$(".item_index").removeAttr("id");
$(this).attr('id', 'servico_ativo');
});
$("a.click_instalacao").click(function(){
$(".conteudo_dinamico").empty()
$.get('instalacao.html', function(result) {
$('.conteudo_dinamico').append(result);
});
$(".item_index").removeAttr("id");
$(this).attr('id', 'servico_ativo');
});
事实证明这是无关的事件委托,该问题是与分配活动状态
$(".item_index").removeAttr("id");
$(this).parent().attr('id', 'servico_ativo');
一些改进可以应用到这
- 使用
data-*
存储目标资源路径 - 使用一种称为类
active
指活动导航项目
尝试
<a href="#" class="item_index click click_assessoria" data-target="assessoria.html">assessoria</a>
<a href="#" class="item_index click click_projeto" data-target="assessoria.html">assessoria</a>
<a href="#" class="item_index click click_instalacao" data-target="instalacao.html">instalacao</a>
然后
var $dinamico = $('.conteudo_dinamico');
$('a.click').on('click', function () {
$dinamico.empty()
$.get($(this).data('target'), function (result) {
$dinamico.append(result);
$(".item_index").removeClass("active");
$(this).parent().addClass('servico_ativo');
});
});
使用在(),而不是点击()
$( "a.click_assessoria" ).on("click",function(){
$(".conteudo_dinamico").empty()
$.get('assessoria.html', function(result) {
$('.conteudo_dinamico').append(result);
$(".item_index").removeAttr("id");
$(this).attr('id', 'servico_ativo');
});
});
$( "a.click_projeto" ).on("click",function(){
$(".conteudo_dinamico").empty()
$.get('projeto.html', function(result) {
$('.conteudo_dinamico').append(result);
$(".item_index").removeAttr("id");
$(this).attr('id', 'servico_ativo');
});
});
$( "a.click_instalacao" ).on("click",function(){
$(".conteudo_dinamico").empty()
$.get('instalacao.html', function(result) {
$('.conteudo_dinamico').append(result);
$(".item_index").removeAttr("id");
$(this).attr('id', 'servico_ativo');
});
});
你给同一个id
到多个HTML元素。 id
S的关系永远是一个HTML文档中是唯一的。
相反设置的id
的元素,你可以为它分配一个class
。 不像id
S,一些HTML元素可以有相同的class
。
更改
$(this).attr('id', 'servico_ativo');
同
$(this).addClass('servico_ativo');
与您的代码的家伙没问题...
您需要变化不大...
普通点击不重视的事件处理函数的一个或多个事件。 这样可以在方法 - 将一个事件处理函数的一个或多个事件来选择的元素。
试试这个代码,并请参阅以下链接:
Jquery的。对()方法
jQuery的正确使用。对方法
$(document).ready(function(){
$(document).on('click', "a.click_assessoria", function () {
$(".conteudo_dinamico").empty()
$.get('assessoria.html', function (result) {
$('.conteudo_dinamico').append(result);
});
$(".item_index").removeAttr("id");
$(this).attr('id', 'servico_ativo');
});
$(document).on('click', "a.click_projeto", function () {
$(".conteudo_dinamico").empty()
$.get('projeto.html', function (result) {
$('.conteudo_dinamico').append(result);
});
$(".item_index").removeAttr("id");
$(this).attr('id', 'servico_ativo');
});
$(document).on('click', "a.click_instalacao", function () {
$(".conteudo_dinamico").empty()
$.get('instalacao.html', function (result) {
$('.conteudo_dinamico').append(result);
});
$(".item_index").removeAttr("id");
$(this).attr('id', 'servico_ativo');
});
});