Читайте URL и показывайте правильные результаты

Question

Может кто-нибудь помочь мне с этим кодом.

Теперь это работает так.

Если URL-адрес

www.example.com/dc.html?dc=apples

Тогда покажи

"I like Apples"

Я хочу показать результат, как указано выше, когда url равен

www.example.com/dc-Apples.html

Значит, если HTML url содержит apple, тогда должно отображаться

"I like Apples"

Вот код, который у меня есть сейчас. .................................................. .................................................. ..........................................

 <style>
    .dynamic-content {
    display:none;
}
</style>
<script src="//code.jquery.com/jquery-1.12.0.min.js"></script>
<script type="text/javascript">
    // Parse the URL parameter
    function getParameterByName(name, url) {
        if (!url) url = window.location.href;
        name = name.replace(/[\[\]]/g, "\\$&");
        var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
            results = regex.exec(url);
        if (!results) return null;
        if (!results[2]) return '';
        return decodeURIComponent(results[2].replace(/\+/g, " "));
    }
    // Give the parameter a variable name
    var dynamicContent = getParameterByName('dc');

     $(document).ready(function() {

        // Check if the URL parameter is apples
        if (dynamicContent == 'apples') {
            $('#apples').show();
        } 
        // Check if the URL parameter is oranges
        else if (dynamicContent == 'oranges') {
            $('#oranges').show();
        } 
        // Check if the URL parameter is bananas
        else if (dynamicContent == 'bananas') {
            $('#bananas').show();
        } 
        // Check if the URL parmeter is empty or not defined, display default content
        else {
            $('#default-content').show();
        }
    });
</script>
<!-- Default Dynamic Section -->
<div id="default-content" class="dynamic-content">
  This is the default content
</div>
<!-- Dynamic Section 1 -->
<div id="apples" class="dynamic-content">
  I like apples
</div>
<!-- Dynamic Section 2 -->
<div id="oranges" class="dynamic-content">
  I like oranges
</div>
<!-- Dynamic Section 3 -->
<div id="bananas" class="dynamic-content">
  I like bananas
</div>

Answer 1

Когда браузер запрашивает www.example.com/dc-Apples.html URL-адрес сервера, сервер ищет файл dc-Apples.html.Так что вам нужно создать dc-Apples.html файл.Поскольку ваш URL является динамическим, невозможно обрабатывать динамический URL только с помощью jQuery.

Для обработки динамического URL-адреса необходимо использовать кодирование на стороне сервера, например .php, asp.net, .htaccess

Ниже я использовал .htaccess и .phpчтобы решить ваш вопрос.

В .htaccess

RewriteEngine on
RewriteRule ^([A-Za-z0-9-]+).html dc.php?dc=$1 [NC,L]

В dc.php

<?php
    if(isset($_GET['dc'])){
        $dc_value = explode("-",$_GET['dc']);
        $dc_value[1] = strtolower($dc_value[1]);
    }else{
        echo "can't get parameter";
        die();
    }
?>

<?php if($dc_value[1] == "apples"): ?>
    <div id="apples" class="dynamic-content">
        I like apples
    </div>
<?php elseif($dc_value[1] == "oranges"): ?>
    <div id="oranges" class="dynamic-content">
        I like oranges
    </div>
<?php elseif($dc_value[1] == "bananas"): ?>
    <div id="bananas" class="dynamic-content">
        I like bananas
    </div>
<?php else: ?>
    <div id="default-content" class="dynamic-content">
        This is the default content
    </div>
<?php endif; ?>

Теперь это будет работать, когда вы звоните www.example.com/dc-Apples.html, это будетдисплей "Я люблю яблоки"

Answer 2

лучшее решение здесь также вы можете проверить этот ответ в соответствии с этим решением вы должны получить значение параметра с реализованной функцией и делать все, что хотите.