如何将div id传递给url

时间:2014-06-04 15:14:15

标签: javascript php html url href

我有一个小项目,我有不同的新闻。我正在给每个新闻一个div id。请在这里查看演示:demo。在当前页面中,我只显示了一小部分新闻。当你点击这个新闻时,另一个页面应该打开,这将显示你点击的完整新闻。我在想我是否可以获取div id并将其传递给url所以我可以用它来识别用户点击的新闻。或者还有其他方法来识别用户点击的新闻吗?任何帮助。谢谢 这是我的代码:

<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td class="page-head">
<img src="/admin/images/background/admin_head_bar_de.gif" border="0" alt="Fahrzeuge einfach effizient verwalten."><br>
</td>
</tr>
<tr>
<td class="welcome-page-hint">
<table width="538" cellpadding="0" cellspacing="0" border="0">
<tr>
<td>

<a href="complete_news.php?id=">
<div class="welcome-rahmen lng toggleNews" id="news_269_kurz">
<p class="welcome-breadcrump">Montag, 19.05.2014</p>
<p class="welcome-subheadline">Teilnahme von MAN Top Used an der Samoter 2014</p>
<div class="newsText">
<p class="welcome-text"><img src="http://intern.autodo.de/admin/news/man-it.jpg" width="165" class="text_fixed" border="0"></p>
<p class="welcome-text">Die 29. Internationale Erd- und Bautechnik-Ausstellung Samoter fand zwischen dem 8. und 11. Mai in Verona statt und zog rund 100.000 Besucher an. Samoter ist die wichtigste italienische Messe ihrer Art, die den Themen Erdbewegung, Hochbau und Baumaschinen gewidmet ist. Zugleich ist diese Veranstaltung damit auch f? europ?chen Markt bedeutsam.</p>
</div>
</div>
</a>

<a href="complete_news.php?id=">
<div class="welcome-rahmen lng toggleNews" id="news_264_kurz">
<p class="welcome-breadcrump">Freitag, 24.01.2014</p>
<p class="welcome-subheadline">Kaufvertrag: neue Porsche-Vorlage zum Drucken!</p>
<div class="newsText">
<img src="http://intern.autodo.de/admin/news/porsche-kaufvertrag.jpg" border="0" align="right" class="img_fixed" width=60><p class="welcome-text">Ihr AMO Druckcenter bietet Ihnen ab sofort die M?chkeit, Kaufvertr? im Porsche-Design zu nutzen.</p>
<p class="page-breadcrump">AutoDo!-Team</p>
</div>
</div>
</a>

<a href="complete_news.php?id=">
<div class="welcome-rahmen lng toggleNews" id="news_265_kurz">
<p class="welcome-breadcrump">Mittwoch, 15.01.2014</p>
<p class="welcome-subheadline">AutoDo! Update: Die Eigenschaft -Unfallfahrzeug- wurde im AMO erweitert!</p>
<div class="newsText">
<p class="welcome-text">Ab sofort k?n Sie Fahrzeuge nach folgenden Kriterien kennzeichnen:</p>
<p class="highlight"><b>? Unfallfahrzeug<br>
? Unfallfrei<br>
? Keine Angabe</b></p>
<p class="page-breadcrump">AutoDo!-Team</p>
</div>
</div>
</a>

<a href="complete_news.php?id=">
<div class="welcome-rahmen krz toggleNews" id="news_262_kurz">
<p class="welcome-breadcrump">Dezember 2013</p>
<p class="welcome-subheadline">NUR OFFLINE!:<br>Machen Sie Ihre Preise fit f? Zukunft:<br>attraktive Preisregulierung mit dem neuen Preismanagement!</p>
<div class="newsText" style="display:none;">
<p class="welcome-text">Entscheiden Sie sich jetzt f? Erweiterungsmodul <b>AMO</b><i>profi!</i> und sichern Sie sich neben umfangreichen Auswertungsm?chkeiten und einem automatischen B?ncheck das brandneue Preismanagement mit folgenden Vorteilen:</p>
<p class="page-breadcrump">AutoDo!-Team</p>
</div>
</div>
</a>

<a href="complete_news.php?id=">
<div class="welcome-rahmen krz toggleNews" id="news_261_kurz">
<p class="welcome-breadcrump">Montag, 02.12.2013</p>
<p class="welcome-subheadline">Zeitsparend und einfach: Automatischer Preisschildversand mit AMO<i>profi!</i></p>
<div class="newsText" style="display:none;">
<img src="/admin/news/preisschild.jpg" border="0" align="right" width="110"><p class="welcome-text">Ab sofort k?n Sie bei Preis?erungen von Fahrzeugen <b>automatisch aktuelle Preisschilder</b> generieren und diese <b>per E-Mail</b> an die gew?en Empf?er weiterleiten! Diese Funktion ist jetzt im Erweiterungsmodul <b>AMO</b><i>profi!</i> erh?lich.</p>
<p class="page-breadcrump">AutoDo!-Team</p>
</div>
</div>
</a>

<a href="complete_news.php?id=">
<div class="welcome-rahmen krz toggleNews" id="news_260_kurz">
<p class="welcome-breadcrump">Montag, 02.12.2013</p>
<p class="welcome-subheadline">Achtung: Ge?erte Modellzuordnung von Mazda und Ford Focus!</p>
<div class="newsText" style="display:none;">
<img src="/admin/news/ford-mazda.gif" border="0" align="right" width="100"><p class="welcome-text">Laut einer aktuellen Information durch <b>mobile.de</b> ist ab dem <b>02.12.2013</b> auf Wunsch der Hersteller Mazda und Ford die Eingabe folgender Modelle per Schnittstelle nicht mehr m?ch: <b>Mazda2, Mazda3, Mazda5, Mazda6 sowie Ford Focus C-Max!</b></p>
<p class="page-breadcrump">AutoDo!-Team</p>
</div>
</div>
</a>

<a href="complete_news.php?id=">
<div class="welcome-rahmen krz toggleNews" id="news_259_kurz">
<p class="welcome-breadcrump">Mittwoch, 20.11.2013</p>
<p class="welcome-subheadline">AutoDo! Update:<br>Exportieren Sie Ihre Fahrzeugbilder zu mercedes-benz.de!</p>
<div class="newsText" style="display:none;"><p class="welcome-text"><img src="/admin/news/mb-boerse.jpg" border="0" width="70" class="img11_fixed">
<p class="welcome-text"></a>Ab sofort k?n Ihre Fahrzeugbilder direkt aus AutoDo! zur Gebrauchtfahrzeugsuche unter <a href="http://www.mercedes-benz.de">www.mercedes-benz.de</a> exportiert werden.</p>

<p class="page-breadcrump">AutoDo!-Team</p>
</div>
</div>
</a>

<a href="complete_news.php?id=">
<div class="welcome-rahmen krz toggleNews" id="news_258_kurz">
<p class="welcome-breadcrump">Mittwoch, 20.11.2013</p>
<p class="welcome-subheadline">Automatische E-Mail-Benachrichtigung ?eue Fahrzeuge im System!</p>
<div class="newsText" style="display:none;">
<p class="welcome-text"><img src="/admin/news/neueingetroffen.jpg" border="0" align="right" width="70"></a>Auf Wunsch informiert Sie Ihr AMO ab sofort t?ich per E-Mail ?eu in das System eingespielte Fahrzeuge. Somit k?n Sie diese noch schneller und gezielter vermarkten!</p>
<p class="page-breadcrump">AutoDo!-Team</p>
</div>
</div>
</a>

<a href="complete_news.php?id=">
<div class="welcome-rahmen krz toggleNews" id="news_255_kurz">
<p class="welcome-breadcrump">Dienstag, 01.10.2013</p>
<p class="welcome-subheadline">ACHTUNG: Wichtige Info zum Fahrzeugexport in die Neuwagenb? von mobile.de!</p>
<div class="newsText" style="display:none;">
<p class="welcome-text"><a href="http://suchen.mobile.de/neu/auto/" target="_blank"><img src="/admin/news/mobile-nw.jpg" border="0" align="right" width="50"></a>Es ist soweit: die mobile.de Neuwagenwelt ist online. Damit ein Fahrzeug hier angezeigt werden kann, m?folgende Kriterien beachtet werden:</p>
<p class="welcome-text" style="padding:0 0 0 20px;"><b>· </b> Ihr Account muss einmalig durch den mobile.de Support <br>
  <b>f? Neuwagenwelt frei geschaltet werden</b>.*<br>
<b>· </b> Es werden <b>ausschlie?ich Lagerfahrzeuge</b> angezeigt.<br>
</p>
</div>
</div>
</a>

<a href="complete_news.php?id=">
<div class="welcome-rahmen krz toggleNews" id="news_254_kurz">
<p class="welcome-breadcrump">Donnerstag, 19.09.2013</p>
<p class="welcome-subheadline">Gelangensbest?gung: jetzt als Vorlage in Ihrem AMO Druckcenter!</p>
<div class="newsText" style="display:none;">
    <p class="welcome-text"><img src="http://intern.autodo.de/admin/news/gelangens-de.gif" border="0" width="210" align="right" class="img12_fixed"></p>
<p class="welcome-text">Ab dem <b>01.10.2013</b> wird f?Verk?e im Abholfalle die Erstellung einer entsprechenden <b>Gelangensbest?gung</b> gefordert, um sicherzustellen, dass die Ware tats?lich im anderen EU-Mitgliedsstaat angekommen ist.</p>
<p class="page-breadcrump">AutoDo!-Team</p>
</div>
</div>
</td>
</tr>
</table>
</a>

2 个答案:

答案 0 :(得分:0)

如果可能的话,你应该只有服务器端代码,它会为你提供HTML代码。它将ID注入URL以及ind元素。

我会避免走客户端路线,但话说回来,并非不可能。

我建议使用jQuery。您基本上必须找到文档中的所有相关链接,并对它们应用单击处理程序,以查找链接中的div并读取id属性并将其附加到链接URL。

有些事情:

$(function(){
  $('a').click(function(){
     var divId = $(this).find('div.toggleNews').attr('id');
     document.location.href = $(this).attr('href') + divId;
  });
});

请注意,此代码未经测试但应该给您一个想法......

答案 1 :(得分:0)

我假设每个href都是你网站上的新闻,所以我做了一些事情。我正在使用悬停作为事件,您可能想要更改它:

$('a').each(function() {
    $(this).hover( function() {
        console.log($(this).children().first().attr('id'));
    },function() {
        console.log("Bye");
})
})

Console.log会在Firefox中记录id,你可以使用id来编写你的ajax get请求。