jQuery show car_orig if $（this）.attr（.class）==“car”

我有li.box ， li.car ，它们在$(this)里面，包含修改后的值，然后我有box_orig ， car_orig包含原始列表……

如何用原始列表替换$(this)的数据（html数据，li的内容），所以如果$(this)包含li.box那么我需要用box_orig的数据替换它

编辑：

 var list = $("ul#list"); var box_orig = list.children('.box'); var car_orig = list.children('.car'); 

和$(this)

  $('#list li').each(function () { if ($.inArray($(this).attr('class'), show) == 0) { console.log($(this)); //-> Returns li.box / car or whatever list was selected } }); 

重新编辑： 重新编辑：

我意识到更换数据会破坏任何东西，所以更换是不可能的，只需显示car / box_orig而不是li.car/box

  $('#list li').each( function(){ //alert($.inArray($(this).attr('class'),show) ); if ($.inArray($(this).attr('class'),show) == 0) { if($(this).attr('class') == 'box') { --> show box_orig, which contains lis with info BUT DO NOT REPLACE THE DATA, just show the box_orig instead of $(this) = li.box } if($(this).attr('class') == 'car') { --> show car_orig, which contains lis with info BUT DO NOT REPLACE THE DATA, just show the box_orig instead of $(this) = li.car } console.log($(this)); } 

HTML：

 jQuery(li.car) result...rifting (line 703) jQuery(li.car) result...rifting (line 703) jQuery(li.car) result...rifting (line 703) jQuery(li.car) result...rifting (line 703) jQuery(li.car) result...rifting (line 703) jQuery(li.car) result...rifting (line 703) jQuery(li.car) result...rifting (line 703) jQuery(li.car) result...rifting (line 703) 

每个li.car包含数据（img和文本）

Answer 1

我不确定你到底是做什么的，但是让我试试:)我制作了两个名单，原始名单和带有“修改”信息的名单：

 
 
orig box1
 
fake box1
 
orig box2
 
orig car1
 
 
 
 
mod box1
 
mod_fake box1
 
mod box2
 
mod car1
  

并应用以下代码：

 var list = $("ul#list"); var box_orig = list.children('.box'); var car_orig = list.children('.car'); var counts = {'box':0, 'car':0}; $('#list2 li').each(function() { var el = $(this).attr('class')+'_orig'; if (typeof (window[el]) !== 'undefined') { $(this).html($(window[el][counts[$(this).attr('class')]]).html()); counts[$(this).attr('class')]++; } }); 

更新：如果您只是尝试在列表中恢复li的原始值，那么此代码可能更容易和简单

 // save data after page load $('#list li').each(function(){ if ($(this).hasClass('box') || $(this).hasClass('car')) $(this).data('original', $(this).html()); }) // when data was updated use this code $('#list li').each(function(){ / if ($(this).hasClass('box') || $(this).hasClass('car')) $(this).html($(this).data('original')); }) 

Answer 2

不完全确定你在问什么。 是否要在每个列表项中替换此类中的整个对象？ 或者仅仅是它的HTML内容？

如果您只想替换它的内容，您可以执行以下操作：

 // Create the list item array + count vars var list_orig = []; var list1_count, list2_count = 0; // Loop through the list items and sort html into the right arrays // eg. list_orig[0] = [listItem class, listItem id, listItem html content]; $('#list li').each(function(index){ if($(this).hasClass("list1")){ list1_count++; var id = "list1_" + list1_count; $(this).attr("id", id); list_orig.push(["list1", id, $(this).html()]); }else if($(this).hasClass("list2")){ list2_count++; var id = "list2_" + list2_count; $(this).attr("id", id); list_orig.push(["list2", id, $(this).html()]); } }); 

此示例只是向列表项添加一个ID，并将此类，每个列表项中的类和原始html放入数组“list_orig”中。

要访问数据并将示例list1项恢复为原始内容，您可以执行以下操作：

 // Example click function to revert list1 back to it's original html $("body").click(function(){ for(var i in list_orig){ alert(list_orig[i][2]); if(list_orig[i][0] == "list1"){ var id = "#" + list_orig[i][1]; $(id).html(list_orig[i][2]); } } }); 

编辑：好，所以你想要用原始列表数据替换数据。 以下是使用编辑中的新代码的示例：

 if ($.inArray($(this).attr('class'),show) === 0) { // CREATE A TEMPORARY VAR FOR YOUR MATCHED LIST (eg. li.box) var x_orig = $(this).attr('class') + "_orig"; x_orig = window[x_orig]; //USE THIS TO CONVERT THE STRING TO A VARIABLE NAME // CREATE A TEMPORRAY VAR FOR THE NEW CONTENT var content = x_orig[0]->innerHtml; // REPLACE THE CONTENT $(this).html(content); } 

我所能做的就是没有看到更多你的HTML。

进一步编辑：实际上你可以只使用一个函数而不需要额外的if语句来检查类。 在这里，我们隐藏当前列表，获取它的类并构造原始列表的类或id并显示原始列表。

 if ($.inArray($(this).attr('class'),show) == 0) { // FIRST HIDE THE CURRENT LIST $(this).hide(); // THEN CONSTRUCT THE ORIGINAL LIST CLASS or ID var x_orig = "." + $(this).attr('class') + "_orig"; // CLASS USING "." // var x_orig = "#" + $(this).attr('class') + "_orig"; // or ID USING "#" // NOW SHOW ORIGINAL USING x_orig VARIABLE FROM ABOVE $(x_orig).show(); console.log($(this)); } 

Answer 3

解：

 var list = $("ul#list"); var box_orig = list.children('.box'); var car_orig = list.children('.car'); ... $('#list li').each( function(){ //alert($.inArray($(this).attr('class'),show) ); if ($.inArray($(this).attr('class'),show) == 0) { if($(this).attr('class') == 'box') { list.append(box_orig); } if($(this).attr('class') == 'car') { list.append(car_orig); } } ... 

Answer 4

这似乎倒退了; 我不知道为什么你想创建一些能够修改的东西，然后在一个事件中，用原始信息替换那个修改。 无论如何，这里有一些问题可以为那些试图给你满意答案的人提供有用的信息：

1）“原始清单”来自哪里？ 是停滞的HTML，它是从数据库中抓取的对象还是数组？

2）如果有，你使用什么服务器架构（例如PHP / MySQL）？

3）你有我们能看到的任何HTML吗？

我想你可能想做点什么：

1）使用MySQL数据库的结果填充初始列表。 2）具有Car的文本输入字段和Box的文本输入字段。 3）让用户在这些输入中放置文本，然后单击某些内容，如按钮或表单提交。 4）用输入中的信息替换初始列表中的特定项目。

如果你回答上面列出的问题，并提供一个更清楚的图片，说明你想要完成什么，我相信你会得到很多好的，有效的答案。