Как отобразить предупреждение Javascript и отобразить iframe, используя динамический раскрывающийся список javascript - PullRequest
Новая
       23

Как отобразить предупреждение Javascript и отобразить iframe, используя динамический раскрывающийся список javascript

0 голосов
/ 04 октября 2019

Я создал динамический выпадающий список, используя JavaScript, и я хочу, чтобы предупреждение, которое появлялось на экране после выбора, говорило, что уровень борьбы выбрал выбранное имя борца и год в предупреждении, и после этого я хочукод JavaScript для отображения I-кадра, который содержит таблицу видео этого борца за этот год. Я немного понимаю логику выпадающего списка, но я не знаю, как поместить выбранные мною выборы в отображение списка в предупреждении, например, уровень борьбы, выбранное имя борца и год. Прямо сейчас все оповещение показывает окончательный выбор, который представляет собой год, но я хочу, чтобы вся информация о выборе была помещена в оповещение. Во-вторых, после отображения этого предупреждения я хочу, чтобы код JavaScript запустил создание I-кадра, который отображает таблицу со всеми видео борца за этот год. Я знаю, как создать таблицу и информацию, связанную с этим, но я не могу понять код для создания I-кадра. Что касается JavaScript, я не очень опытен и буду считать новичка, любая помощь будет оценена. 

<!DOCTYPE html>
<html lang="en-us">
<head>
<title>Test</title>
<script type="text/javascript">
function urlRedirectTo(obj)
            {
                alert('Here are all the wrestling videos for '+obj);
                if('2013-2014' == obj)
                var iframe = document.createElement('iframe');
                var html = '<body>Foo</body>';
                document.body.appendChild(iframe);
                iframe.contentWindow.document.open();
                iframe.contentWindow.document.write(html);
                iframe.contentWindow.document.close();
                //if('wordpress_version2' == obj)
                    //window.location = 'https://wordpress.org/download/';
            }
            function dynamicdropdown(listindex)
            {
                document.getElementById("sub_subcategory").length = 0;
                document.getElementById("sub_subcategory").options[0]=new Option("Please select Year","");
                document.getElementById("subcategory").length = 0;
                switch (listindex)
                {
                    case "Elementary" :
                        document.getElementById("subcategory").options[0]=new Option("Please select Wrestler","");
                        document.getElementById("subcategory").options[1]=new Option("Wordpress","Wordpress");
                        document.getElementById("subcategory").options[2]=new Option("Magento","Magento");
                        break;

                    case "Junior High" :
                        document.getElementById("subcategory").options[0]=new Option("Please select Wrestler","");
                        document.getElementById("subcategory").options[1]=new Option("Strauts","Strauts");
                        document.getElementById("subcategory").options[2]=new Option("Hibernate","Hibernate");
                        break;
                    case "Junior Varsity" :
                        document.getElementById("subcategory").options[0]=new Option("Please select Wrestler","");
                        document.getElementById("subcategory").options[1]=new Option("Prototype","Prototype");
                        document.getElementById("subcategory").options[2]=new Option("jQuery","jQuery");
                        break;
                    case "Varsity" :
                        document.getElementById("subcategory").options[0]=new Option("Please select Wrestler","");
                        document.getElementById("subcategory").options[1]=new Option("Marc Hendricks","Marc Hendricks");
                        break;
                    default:
                        document.getElementById("subcategory").options[0]=new Option("Please select Wrestler","");
                        break;
                }
                return true;
            }

            function dynamicdropdownone(listindex)
            {
                document.getElementById("sub_subcategory").length = 0;
                switch (listindex)
                {
                    case "Wordpress" :
                        document.getElementById("sub_subcategory").options[0]=new Option("Please select Year","");
                        document.getElementById("sub_subcategory").options[1]=new Option("Wordpress Version1","wordpress_version1");
                        document.getElementById("sub_subcategory").options[2]=new Option("Wordpress Version2","wordpress_version2");
                        break;

                    case "Magento" :
                        document.getElementById("sub_subcategory").options[0]=new Option("Please select Year","");
                        document.getElementById("sub_subcategory").options[1]=new Option("Magento Version1","magento_version1");
                        document.getElementById("sub_subcategory").options[2]=new Option("Magento Version2","magento_version2");
                        break;
                    case "Strauts" :
                        document.getElementById("sub_subcategory").options[0]=new Option("Please select Year","");
                        document.getElementById("sub_subcategory").options[1]=new Option("Strauts Version1","strauts_version1");
                        document.getElementById("sub_subcategory").options[2]=new Option("Strauts Version2","strauts_version2");
                        break;

                    case "Hibernate" :
                        document.getElementById("sub_subcategory").options[0]=new Option("Please select Year","");
                        document.getElementById("sub_subcategory").options[1]=new Option("Hibernate Version1","hibernate_version1");
                        document.getElementById("sub_subcategory").options[2]=new Option("Hibernate Version2","hibernate_version2");
                        break;
                    case "Prototype" :
                        document.getElementById("sub_subcategory").options[0]=new Option("Please select Year","");
                        document.getElementById("sub_subcategory").options[1]=new Option("Prototype Version1","prototype_version1");
                        document.getElementById("sub_subcategory").options[2]=new Option("Prototype Version2","prototype_version2");
                        break;

                    case "jQuery" :
                        document.getElementById("sub_subcategory").options[0]=new Option("Please select Year","");
                        document.getElementById("sub_subcategory").options[1]=new Option("jQuery Version1","jquery_version1");
                        document.getElementById("sub_subcategory").options[2]=new Option("jQuery Version2","jquery_version2");
                        break;
                    case "Marc Hendricks" :
                        document.getElementById("sub_subcategory").options[0]=new Option("Please select Year","");
                        document.getElementById("sub_subcategory").options[1]=new Option("2013-2014","2013-2014");
                        document.getElementById("sub_subcategory").options[2]=new Option("2014-2015","2014-2015");
                        document.getElementById("sub_subcategory").options[3]=new Option("2015-2016","2015-2016");
                        document.getElementById("sub_subcategory").options[4]=new Option("2016-2017","2016-2017");
                        document.getElementById("sub_subcategory").options[5]=new Option("2017-2018","2017-2018");
                        break;
                    default:
                        document.getElementById("sub_subcategory").options[0]=new Option("Please select Year","");
                        break;
                }
                return true;
            }
       </script>
</head>
<body>
  <div class="sub_category_div" id="sub_category_div">
            <script type="text/javascript" Wrestling Level="JavaScript">
                document.write('<select name="subcategory" id="subcategory" onchange="javascript: dynamicdropdownone(this.options[this.selectedIndex].value);"><option value="">Please select Wrestler</option></select>')
            </script>
            <noscript>
                <select name="subcategory" id="subcategory" >
                    <option value="">Please select Year</option>
                </select>
            </noscript>
        </div>

  <div class="sub_subcategory_div" id="sub_subcategory_div">
            <script type="text/javascript" Wrestling Level="JavaScript">
                document.write('<select name="sub_subcategory" onchange="javascript: urlRedirectTo(this.options[this.selectedIndex].value);" id="sub_subcategory"><option value="">Please select Year</option></select>')
            </script>
            <noscript>
                <select name="sub_subcategory" id="sub_subcategory" >
                    <option value="">Please select Year</option>
                </select>
            </noscript>
        </div>
</body>
</html>
...