Javascript 关于制作多查找词典的问题_Javascript_Html_Jquery_Css_Dictionary

Javascript 关于制作多查找词典的问题

javascript html jquery css dictionary

Javascript 关于制作多查找词典的问题,javascript,html,jquery,css,dictionary,Javascript,Html,Jquery,Css,Dictionary,我正在尝试制作一个网页，用英语或西班牙语搜索单词。为此，我使用了两个选项卡，一个是英语，一个是西班牙语。每个选项卡都有一个相关的div，因此如果我单击English选项卡，它将带我到English div，如果我单击spanish选项卡，它将带我到spanish div。在每个div中，都有一个带有“search”按钮的搜索栏，还有8个选项卡以及相应的相关div。其中的每个div都有一个iframe，我希望在这里显示搜索结果其思路如下：点击英语标签例如，我写“水”，然后按下“搜索”

我正在尝试制作一个网页，用英语或西班牙语搜索单词。为此，我使用了两个选项卡，一个是英语，一个是西班牙语。每个选项卡都有一个相关的div，因此如果我单击English选项卡，它将带我到English div，如果我单击spanish选项卡，它将带我到spanish div。在每个div中，都有一个带有“search”按钮的搜索栏，还有8个选项卡以及相应的相关div。其中的每个div都有一个iframe，我希望在这里显示搜索结果

其思路如下：

点击英语标签

例如，我写“水”，然后按下“搜索”按钮

如果我单击下面8个选项卡中的任何一个，搜索结果的页面主体必须显示在iframe内

问题是目标页面没有显示在iframe中，它告诉我它必须是一个完整的页面。这能以任何方式解决吗

这是我的代码，我目前只实现了rae西班牙语词典但错误是相同的

<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title>Dicenes</title>
<script type="application/javascript" language="javascript" src="fJavascript.js"></script>
<script src="jQueryAssets/jquery-1.8.3.min.js" type="text/javascript"></script>
<script src="jQueryAssets/jquery-ui-1.9.2.tabs.custom.min.js" type="text/javascript"></script>
<link href="jQueryAssets/jquery.ui.core.min.css" rel="stylesheet" type="text/css">
  <link href="jQueryAssets/jquery.ui.theme.min.css" rel="stylesheet" type="text/css">
  <link href="jQueryAssets/jquery.ui.tabs.min.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="tabIdiomas">
  <ul>
    <li><a href="#tabs-1">Inglés</a></li>
<li><a href="#tabs-2">Español</a></li>
</ul>
  <div id="tabs-1">
    <label for="txtIngles">Búsqueda:</label>
    &nbsp;
    <input type="text" name="txtIngles" id="txtIngles" style="width: 150 px;">
    &nbsp;
    <input type="button" name="cmdBuscarIngles" id="cmdBuscarIngles" value="Buscar">
    <p></p>
<div id="tabIngles">
      <ul>
        <li><a href="#tabs-3">Ficha 1</a></li>
        <li><a href="#tabs-4">Ficha 2</a></li>
        <li><a href="#tabs-5">Ficha 3</a></li>
        <li><a href="#tabs-6">Ficha 4</a></li>
        <li><a href="#tabs-7">Ficha 5</a></li>
        <li><a href="#tabs-8">Ficha 6</a></li>
        <li><a href="#tabs-9">Ficha 7</a></li>
        <li><a href="#tabs-10">Ficha 8</a></li>
      </ul>
      <div id="tabs-3">
        <p>Contenido 1 inglés</p>
      </div>
      <div id="tabs-4">
        <p>Contenido 2 inglés</p>
      </div>
      <div id="tabs-5">
        <p>Contenido 3 inglés</p>
      </div>
      <div id="tabs-6">
        <p>Contenido 4 inglés</p>
      </div>
      <div id="tabs-7">
        <p>Contenido 5 inglés</p>
      </div>
      <div id="tabs-8">
        <p>Contenido 6 inglés</p>
      </div>
      <div id="tabs-9">
        <p>Contenido 7 inglés</p>
      </div>
      <div id="tabs-10">
        <p>Contenido 8 inglés</p>
      </div>
    </div>
  </div>
  <div id="tabs-2">
    <label for="txtEspañol">Búsqueda:</label>
    &nbsp;
    <input type="text" name="txtEspañol" id="txtEspañol" style="width: 150 px;">
    &nbsp;
    <input type="button" name="cmdBuscarEspañol" id="cmdBuscarEspañol" value="Buscar" onClick="buscar(txtEspañol.value, 'español')">
    <p></p>
    <div id="Tabs1">
      <ul>
        <li><a href="#tabs-11">Collins</a></li>
        <li><a href="#tabs-12">Ficha 2</a></li>
        <li><a href="#tabs-13">Ficha 3</a></li>
        <li><a href="#tabs-14">Ficha 4</a></li>
        <li><a href="#tabs-15">Ficha 5</a></li>
        <li><a href="#tabs-16">Ficha 6</a></li>
        <li><a href="#tabs-17">RAE</a></li>
        <li><a href="#tabs-18">DIRAE</a></li>
      </ul>
      <div id="tabs-11">
        <p>Contenido 1 español</p>
        <iframe name="fraE1" id="fraE1" width=883></iframe>

      </div>
      <div id="tabs-12">
        <p>Contenido 2 español</p>
      </div>
      <div id="tabs-13">
        <p>Contenido 3 español</p>
      </div>
      <div id="tabs-14">
        <p>Contenido 4 español</p>
      </div>
      <div id="tabs-15">
        <p>Contenido 5 español</p>
      </div>
      <div id="tabs-16">
        <p>Contenido 6 español</p>
      </div>
      <div id="tabs-17">
        <p>Contenido 7 español</p>
        <iframe name="fraE7" id="fraE7"></iframe>
      </div>
      <div id="tabs-18">
        <p>Contenido 8 español</p>
        <iframe name="fraE8" id="fraE8" width=883></iframe>
      </div>
    </div>
  </div>
</div>
<script type="text/javascript">
$(function() {
  $( "#tabIdiomas" ).tabs(); 
});
$(function() {
  $( "#tabIngles" ).tabs(); 
});
$(function() {
  $( "#Tabs1" ).tabs(); 
});
</script>
</body>
</html>

我们需要查看您的代码才能解决

它告诉我它必须是一个完整的页面

，我认为是通过https。有没有办法调用https页面并像http一样返回它？“完成！我必须把所有的代码都改成VB.NET，但它可以工作。谢谢大家。

    function buscar(termino, idioma)
    {
        if(termino == "")
        {
            alert("Campo 'Búsqueda' en blanco");
            return false;
        }
        switch(idioma)
        {
            case "ingles":
            break;
            case "español":
                document.getElementById("fraE1").src = "https://www.collinsdictionary.com/es/diccionario/espanol-ingles/" + termino;
                document.getElementById("fraE7").src = "https://dle.rae.es/" + termino;
                document.getElementById("fraE8").src = "https://dirae.es/palabras/" + termino;
                
            break;
        }
    }