30/09/2018, 23:33

Hỏi về tab trong HTML

Em đang học về HTML. Em đang học cách làm tab trong HTML, ví dụ em có 3 tab trong HTML như code dưới.

<!DOCTYPE html>
<html>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://www.w3schools.com/lib/w3.css">
<body>

<div class="w3-container">


<div id="London" class="w3-container city">
  <h2>London</h2>
  <p>London is the capital city of England.</p>
</div>

<div id="Paris" class="w3-container city">
  <h2>Paris</h2>
  <p>Paris is the capital of France.</p>
</div>

<div id="Tokyo" class="w3-container city">
  <h2>Tokyo</h2>
  <p>Tokyo is the capital of Japan.</p>
</div>

<script>
openCity("Paris")
function openCity(cityName) {
    var i;
    var x = document.getElementsByClassName("city");
    for (i = 0; i < x.length; i++) {
       x[i].style.display = "none";
    }
    document.getElementById(cityName).style.display = "block";
}
</script>

</body>
</html>

Em muốn hỏi có cách nào để gọi tới một tab bất kì thông qua link hay không?
VD:
http://www.link.com/Paris sẽ gọi tới tab Paris luôn
http://www.link.com/Tokyo1 sẽ gọi tớ tab Tokyo luôn

ACP viết 01:33 ngày 01/10/2018

Cách thường dùng là dùng hastag
Vd: http://www.link.com/#Paris thì nó sẽ chạy tới tab Paris (tab có id là Paris). Dù ở trang khác thì nó cũng redirect về trang link.com và chạy tới tab Paris
Lưu ý: không dùng http://www.link.com/Paris nhé vì link như vầy dễ bị nhầm lẫn với 1 url bên ngoài.

terrypaton viết 01:49 ngày 01/10/2018

Sao nó không hoạt động nhỉ

ACP viết 01:39 ngày 01/10/2018

Không hoạt động là bị gì? Nói rõ thì mới giúp được chứ

Võ Hoài Nam viết 01:45 ngày 01/10/2018

Bác phải khai báo đúng cú pháp. Muốn nhảy tới <a href="#hashtag">Hashtag</a> thì bạn phải đặt id="hashtag" ở nơi cần đến. Ví dụ dưới đây (hơi dài, nhưng dễ minh họa).

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title></title>
	<link rel="stylesheet" href="">
</head>
<body>
	<div>
		<a href="#paris">Click to Paris</a>
		<a href="#tokyo">Click to Tokyo</a>
		<a href="#switzerland">Click to Switzerland</a>

		<div id="paris">
			<h2>Paris</h2>
			<p>
				Paris (French: [paʁi] ( listen)), is the capital and the most populous city of France. It has an area of 105 km² (41 mi²) and a population in 2013 of 2,229,621 within the city limits.[4] Paris is both a commune and department, and forms the centre and headquarters of the Île-de-France, or Paris Region, which has an area of 12,012 square kilometers (4,638 square miles) and a population in 2014 of 12,005,077, comprising 18.2 percent of the population of France.[5] Paris was founded in the 3rd century BC by a Celtic people called the Parisii, who gave the city its name. By the 12th century, Paris was the largest city in the western world, a prosperous trading centre, and the home of the University of Paris, one of the oldest universities in history. At 17th century is the capital of Europe's major power. In the 18th century, it was the centre stage of the French Revolution, and was an important centre of finance, commerce, fashion, science, and the arts, a position it still retains today.
			</p>
			<p>
				Paris is the home of important museums and cultural institutions, including the most visited art museum in the world, the Louvre, as well as the Musée d'Orsay, noted for its collection of French Impressionist art, and the Musée National d'Art Moderne in the Pompidou Centre, the largest collection of modern and contemporary art in Europe. The Central area of Paris along the Seine River is classified as a UNESCO Heritage Site, and includes many notable monuments, including Notre Dame Cathedral (12th century); the Sainte-Chapelle (13th century); the Eiffel Tower (1889); the Grand and Petit Palais (1900); and the Basilica of Sacré-Cœur on Montmartre (1914). In 2015 Paris received 22.2 million visitors, making it one of the world's top tourist destinations.[6] Paris is also known for its fashion, particularly the twice-yearly Paris Fashion Week, and for its haute cuisine, and three-star restaurants. Most of France's major universities and grandes écoles are located in Paris, as are France's major newspapers, including Le Monde, Le Figaro, and Libération.
			</p>
			<p>
				The association football club Paris Saint-Germain and the rugby union club Stade Français are based in Paris. The 80,000-seat Stade de France, built for the 1998 FIFA World Cup, is located just north of Paris in the commune of Saint-Denis. Paris hosts the annual French Open Grand Slam tennis tournament on the red clay of Roland Garros. Paris hosted the 1900 and 1924 Summer Olympics, the 1938 and 1998 FIFA World Cups, and the 2007 Rugby World Cup. Every July, the Tour de France of cycling finishes in the city.
			</p>
			<p>
				The city is also a major rail, highway, and air-transport hub, served by the two international airports Paris-Charles de Gaulle (the second busiest airport in Europe after London Heathrow Airport with 63,8 millions passengers in 2014) and Paris-Orly. Opened in 1900, the city's subway system, the Paris Métro, serves 4.5 million passengers daily.[7] It is the second busiest metro system in Europe after Moscow Metro. Paris is the hub of the national road network, and is surrounded by three orbital roads: the Périphérique, the A86 motorway, and the Francilienne motorway.
			</p>
			<p>
				The agglomeration has grown well beyond Paris' administrative limits. The Paris unité urbaine is a measure of Paris' continuous urban area for statistical purposes, including both the commune and its suburbs, and has a population of 10,550,350 (Jan. 2012 census) which makes it the largest in the European Union.[2] The aire urbaine de Paris, a measure of Paris' metropolitan area, spans most of the Île-de-France region and has a population of 12,405,426 (Jan. 2013 census),[8] constituting one-fifth of the population of France.[9] The Metropole of Grand Paris was created in 2016, combining the city and its nearest suburbs into a single area for economic and environmental cooperation. Grand Paris covers 814 square kilometers and has a population of 6.945 million persons.[10]
			</p>
		</div>

		<div id="tokyo">
			<h2>Tokyo</h2>
			<p>
				Tokyo (東京 Tōkyō?, "Eastern Capital") (Japanese: [toːkjoː] ( listen), English /ˈtoʊki.oʊ/), officially Tokyo Metropolis (東京都 Tōkyō-to),[4] is one of the 47 prefectures of Japan,[5] and is both the capital and most populous city of Japan. The Greater Tokyo Area is the most populous metropolitan area in the world.[6] It is the seat of the Emperor of Japan and the Japanese government. Tokyo is in the Kantō region on the southeastern side of the main island Honshu and includes the Izu Islands and Ogasawara Islands.[7] Formerly known as Edo, it has been the de facto seat of government since 1603 when Shogun Tokugawa Ieyasu made the city his headquarters. It officially became the capital after Emperor Meiji moved his seat to the city from the old capital of Kyoto in 1868; at that time Edo was renamed Tokyo. Tokyo Metropolis was formed in 1943 from the merger of the former Tokyo Prefecture (東京府 Tōkyō-fu) and the city of Tokyo (東京市 Tōkyō-shi).
			</p>
			<p>
				Tokyo is often referred to as a city, but is officially known and governed as a "metropolitan prefecture", which differs from and combines elements of a city and a prefecture, a characteristic unique to Tokyo. The Tokyo metropolitan government administers the 23 Special Wards of Tokyo (each governed as an individual city), which cover the area that was the City of Tokyo before it merged and became the metropolitan prefecture in 1943. The metropolitan government also administers 39 municipalities in the western part of the prefecture and the two outlying island chains. The population of the special wards is over 9 million people, with the total population of the prefecture exceeding 13 million. The prefecture is part of the world's most populous metropolitan area with upwards of 37.8 million people and the world's largest urban agglomeration economy. The city hosts 51 of the Fortune Global 500 companies, the highest number of any city in the world.[8] Tokyo ranked third in the International Financial Centres Development IndexEdit. The city is also home to various television networks like Fuji TV, Tokyo MX, TV Tokyo, TV Asahi, Nippon Television, NHK and the Tokyo Broadcasting System.
			</p>
			<p>
				Tokyo ranked fifth in the Global Economic Power Index and fourth in the Global Cities Index. The city is considered an alpha+ world city – as listed by the GaWC's 2008 inventory[9] – and in 2014, Tokyo was ranked first in the "Best overall experience" category of TripAdvisor's World City Survey (the city also ranked first in the following categories: "helpfulness of locals", "nightlife", "shopping", "local public transportation" and "cleanliness of streets").[10] In 2015, Tokyo was ranked as the 11th most expensive city for expatriates, according to the Mercer consulting firm,[11] and also the world's 11th most expensive city, according to the Economist Intelligence Unit's cost-of-living survey.[12] In 2015, Tokyo was named the Most Liveable City in the world by the magazine Monocle.[13] The Michelin Guide has awarded Tokyo by far the most Michelin stars of any city in the world.[14][15] Tokyo ranked first in the world in the Safe Cities Index.[16] The 2016 edition of QS Best Student Cities ranked Tokyo as the 3rd-best city in the world to be a university student.[17] Tokyo hosted the 1964 Summer Olympics, the 1979 G-7 summit, the 1986 G-7 summit, and the 1993 G-7 summit, and will host the 2020 Summer Olympics and the 2020 Summer Paralympics.
			</p>
		</div>
		<div id="switzerland">
			<h2>Switzerland</h2>
			<p>
				Switzerland (/ˈswɪtsərlənd/), officially the Swiss Confederation) is a federal republic in Europe. While still named the "Swiss Confederation" for historical reasons, modern Switzerland is a federal directorial republic consisting of 26 cantons, with Bern as the seat of the federal authorities, called '"federal city" (German: Bundesstadt, French: Ville féderale, Italian: Capitale federale).[1][2][note 3] The country is situated in Western-Central Europe,[note 4] and is bordered by Italy to the south, France to the west, Germany to the north, and Austria and Liechtenstein to the east. Switzerland is a landlocked country geographically divided between the Alps, the Swiss Plateau and the Jura, spanning an area of 41,285 km2 (15,940 sq mi). While the Alps occupy the greater part of the territory, the Swiss population of approximately eight million people is concentrated mostly on the plateau, where the largest cities are to be found: among them are the two global and economic centres Zürich and Geneva.
			</p>
			<p>
				The establishment of the Old Swiss Confederacy dates to the late medieval period, resulting from a series of military successes against Austria and Burgundy. Swiss independence from the Holy Roman Empire was formally recognized in the Peace of Westphalia in 1648. The country has a history of armed neutrality going back to the Reformation, it has not been in a state of war internationally since 1815 and did not join the United Nations until 2002. Nevertheless, it pursues an active foreign policy and is frequently involved in peace-building processes around the world.[9] In addition to being the birthplace of the Red Cross, Switzerland is home to numerous international organisations, including the second largest UN office. On the European level, it is a founding member of the European Free Trade Association, but notably it is not part of the European Union, nor the European Economic Area. However, the country does participate in the Schengen Area and the EU's single market through a number of bilateral treaties.
			</p>
			<p>
				Spanning the intersection of Germanic and Romance Europe, Switzerland comprises four main linguistic and cultural regions: German, French, Italian and Romansh. Although the majority of the population are German speaking, Swiss national identity is rooted in a common historical background, shared values such as federalism and direct democracy,[10] and Alpine symbolism.[11][12] Due to its linguistic diversity, Switzerland is known by a variety of native names: Schweiz [ˈʃvaɪts] (German);[note 5] Suisse [sɥis(ə)] (French); Svizzera [ˈzvittsera] (Italian); and Svizra [ˈʒviːtsrɐ] or [ˈʒviːtsʁːɐ] (Romansh).
			</p>
			<p>
				Switzerland is one of the most developed countries in the world, with the highest nominal wealth per adult and the eighth-highest per capita gross domestic product according to the IMF.[13][14] Switzerland ranks at or near the top globally in several metrics of national performance, including government transparency, civil liberties, quality of life, economic competitiveness, and human development. Zürich and Geneva have each been ranked among the top cities in the world in terms of quality of life, with the former ranked second globally, according to Mercer.[15]
			</p>
		</div>
	</div>
</body>
</html>

Còn nếu theo như câu hỏi của bạn, nếu sử dụng hashtag để tạo ra một đường link, khi click vào nó sẽ hiển thị tab mình cần. Cái này bạn phải sử dụng JavaScript để phân tích nội dung của hashtag để hiện tab cần thiết, ẩn mấy tab kia đi. Bạn xem mã giả dưới đây. Mình lười nên dùng tạm cú pháp của jQuery.

tabs.hide();

hashtag = parseHashtagURL(url); // Hàm này bạn tự viết nhé
$(hashtag).show();

// Giả sử ta chọn hashtag là "paris"
$('.tab').hide(); // ẩn hết các tab
$('#paris').show();

Bình luận về bài viết này

Chia sẻ tin đăng đến bạn bè

Gửi Messenger

Bài liên quan

terrypaton

0 chủ đề

0 bài viết

Tác giả nổi bật