Новое в расширении Chrome: не работает должным образом - PullRequest
0 голосов
/ 04 июля 2018

Я новичок в разработке расширений Google Chrome. У меня есть базовые знания HTML и Java.

Я создал имя папки «Расширение». в котором есть 4 файла, как показано ниже.

1.manifest.json

{


 "manifest_version": 2,

 "name": "lenght Unit converter",
  "description": "This extension will convert the lenght from one unit to other ",
  "version": "1.0",

  "browser_action": {
   "default_icon": "Refresh.png",
   "default_popup": "popup.html"
  },
  "permissions": [
   "activeTab"
   ]
}

2.popup.html

    <!doctype html>
<html>
<head>
    <title>Length Unit Converter</title>

   <script src="popup.js"></script>
</head>

<body>
<h1>Lenght Unit Converter</h1>
<input type="text" name="inputText" id="inputValue" required onfocus="clearTextBox()">
<select id="list1" onchange="getSelectValue1()">
                <option value="km">Kilometre</option>
                <option value="m">Metre</option>
                <option value="cm">Centimetre</option>
                <option value="mm">Millimetre</option>
                <option value="mc">Micrometre</option>
                <option value="nm">Nanometre</option>
                <option value="ml">Mile</option>
                <option value="yd">Yard</option>
                <option value="ft">Foot</option>
                <option value="ic">Inch</option>
                <option value="ntm">Nautical mile</option>


            </select>
<br>
 <input id="display" type="text" name="display" readonly>
            <select id="list2" onchange="getSelectValue2()">
                <option value="km">Kilometre</option>
                <option value="m">Metre</option>
                <option value="cm">Centimetre</option>
                <option value="mm">Millimetre</option>
                <option value="mc">Micrometre</option>
                <option value="nm">Nanometre</option>
                <option value="ml">Mile</option>
                <option value="yd">Yard</option>
                <option value="ft">Foot</option>
                <option value="ic">Inch</option>
                <option value="ntm">Nautical mile</option>
            </select>
</br>
<br><input type="button" value="convert" onclick="setValueToTextBox()"></br>


</body>
</html>

3.popup.js

В файле popup.js я написал свою логику для функций, присутствующих в html-файле.

  1. Refresh.png

Refresh.png - размер изображения в формате png 28x28.

Всякий раз, когда я открываю свой файл popup.html с помощью firefox, он работает нормально. Снимок экрана приведен ниже. введите описание изображения здесь

введите описание изображения здесь

** Скорее всего, вы можете запустить мой код снизу здесь

var input1;
var input2;
var inputValue;
function clearTextBox() {
    document.getElementById("display").value="";
}
function getInputValue(){
    inputValue=document.getElementById("inputValue").value.toString();
}
function getSelectValue1() {
    input1=document.getElementById("list1").value.toString();

}
function getSelectValue2() {
    input2= document.getElementById("list2").value.toString();
    document.getElementById("display").value="";
}

function setValueToTextBox()
{
    document.getElementById("display").value=answer().toString();
}

function answer() {
    getSelectValue1();
    getSelectValue2();
    getInputValue();

    if (input1 == "km") {
        switch (input2) {
            case "km":
                return parseInt(inputValue) * 1;
                break;
            case "m":
                return parseInt(inputValue) * 1000;

                break;
            case "cm":
                return parseInt(inputValue) * 100000;
                break;
            case "mm":
                return parseInt(inputValue) * 1000000;
                break;
            case "mc":
                return parseInt(inputValue) * 1000000000;
                break;
            case "nm":
                return parseInt(inputValue) * 1000000000000;
                break;
            case "ml":
                return parseInt(inputValue) * 0.621371;
                break;
            case "yd":
                return parseInt(inputValue) * 1093.61;
                break;
            case "ft":
                return parseInt(inputValue) * 3280.84;
                break;
            case "ic":
                return parseInt(inputValue) * 39370.1;
                break;
            case "ntm":
                return parseInt(inputValue) * 0.539957;
                break;

        }
    }
    if (input1 == "m") {
        switch (input2) {
            case "km":
                return parseInt(inputValue) * 0.001;
                break;
            case "m":
                return parseInt(inputValue) * 1;

                break;
            case "cm":
                return parseInt(inputValue) * 100;
                break;
            case "mm":
                return parseInt(inputValue) * 1000;
                break;
            case "mc":
                return parseInt(inputValue) * 1000000;
                break;
            case "nm":
                return parseInt(inputValue) * 1000000000;
                break;
            case "ml":
                return parseInt(inputValue) * 0.000621371;
                break;
            case "yd":
                return parseInt(inputValue) * 1.09361;
                break;
            case "ft":
                return parseInt(inputValue) * 3.28084;
                break;
            case "ic":
                return parseInt(inputValue) * 39.3701;
                break;
            case "ntm":
                return parseInt(inputValue) * 0.000539957;
                break;

        }

    }

    if (input1 == "cm") {
        switch (input2) {

            case "km":
                return parseInt(inputValue) * 0.00001;
                break;
            case "m":
                return parseInt(inputValue) * 0.01;

                break;
            case "cm":
                return parseInt(inputValue) * 1;
                break;
            case "mm":
                return parseInt(inputValue) * 10;
                break;
            case "mc":
                return parseInt(inputValue) * 10000;
                break;
            case "nm":
                return parseInt(inputValue) * 10000000;
                break;
            case "ml":
                return parseInt(inputValue) * 0.0000062137;
                break;
            case "yd":
                return parseInt(inputValue) * 0.0109361;
                break;
            case "ft":
                return parseInt(inputValue) * 0.0328084;
                break;
            case "ic":
                return parseInt(inputValue) * 0.393701;
                break;
            case "ntm":
                return parseInt(inputValue) * 0.0000053996;
                break;

        }

    }
    if (input1 == "mm") {
        switch (input2) {

            case "km":
                return parseInt(inputValue) * 0.000001;
                break;
            case "m":
                return parseInt(inputValue) * 0.001;

                break;
            case "cm":
                return parseInt(inputValue) * 0.1;
                break;
            case "mm":
                return parseInt(inputValue) * 1;
                break;
            case "mc":
                return parseInt(inputValue) * 1000;
                break;
            case "nm":
                return parseInt(inputValue) * 1000000;
                break;
            case "ml":
                return parseInt(inputValue) * 0.00000062137;
                break;
            case "yd":
                return parseInt(inputValue) * 0.00109361;
                break;
            case "ft":
                return parseInt(inputValue) * 0.00328084;
                break;
            case "ic":
                return parseInt(inputValue) * 0.0393701;
                break;
            case "ntm":
                return parseInt(inputValue) * 0.00000053996;
                break;

        }

    }

    if (input1 == "mc") {
        switch (input2) {

            case "km":
                return parseInt(inputValue) * 0.000000001;
                break;
            case "m":
                return parseInt(inputValue) * 0.000001;

                break;
            case "cm":
                return parseInt(inputValue) * 0.0001;
                break;
            case "mm":
                return parseInt(inputValue) * 0.001;
                break;
            case "mc":
                return parseInt(inputValue) * 1;
                break;
            case "nm":
                return parseInt(inputValue) * 1000;
                break;
            case "ml":
                return parseInt(inputValue) * 0.00000000062137;
                break;
            case "yd":
                return parseInt(inputValue) * 0.0000010936;
                break;
            case "ft":
                return parseInt(inputValue) * 0.0000032808;
                break;
            case "ic":
                return parseInt(inputValue) * 0.00003937;
                break;
            case "ntm":
                return parseInt(inputValue) * 0.00000000053996;
                break;

        }

    }
    if (input1 == "nm") {
        switch (input2) {

            case "km":
                return parseInt(inputValue) * 0.000000000001;
                break;
            case "m":
                return parseInt(inputValue) * 0.000000001;

                break;
            case "cm":
                return parseInt(inputValue) * 0.0000001;
                break;
            case "mm":
                return parseInt(inputValue) * 0.000001;
                break;
            case "mc":
                return parseInt(inputValue) * 0.001;
                break;
            case "nm":
                return parseInt(inputValue) * 1;
                break;
            case "ml":
                return parseInt(inputValue) * 0.00000000000062137;
                break;
            case "yd":
                return parseInt(inputValue) * 0.0000000010936;
                break;
            case "ft":
                return parseInt(inputValue) * 0.0000000032808;
                break;
            case "ic":
                return parseInt(inputValue) * 0.00000003937;
                break;
            case "ntm":
                return parseInt(inputValue) * 0.00000000000053996;
                break;

        }

    }
    if (input1 == "ml") {
        switch (input2) {

            case "km":
                return parseInt(inputValue) * 1.60934;
                break;
            case "m":
                return parseInt(inputValue) * 1609.34;

                break;
            case "cm":
                return parseInt(inputValue) * 160934;
                break;
            case "mm":
                return parseInt(inputValue) * 1609000;
                break;
            case "mc":
                return parseInt(inputValue) * 1609000000;
                break;
            case "nm":
                return parseInt(inputValue) * 1609000000000;
                break;
            case "ml":
                return parseInt(inputValue) * 1;
                break;
            case "yd":
                return parseInt(inputValue) * 1760;
                break;
            case "ft":
                return parseInt(inputValue) * 5280;
                break;
            case "ic":
                return parseInt(inputValue) * 63360;
                break;
            case "ntm":
                return parseInt(inputValue) * 0.868976;
                break;

        }

    }
    if (input1 == "yd") {
        switch (input2) {

            case "km":
                return parseInt(inputValue) * 0.0009144;
                break;
            case "m":
                return parseInt(inputValue) * 0.9144;

                break;
            case "cm":
                return parseInt(inputValue) * 91.44;
                break;
            case "mm":
                return parseInt(inputValue) * 914.4;
                break;
            case "mc":
                return parseInt(inputValue) * 914400;
                break;
            case "nm":
                return parseInt(inputValue) * 914400000;
                break;
            case "ml":
                return parseInt(inputValue) * 0.000568182;
                break;
            case "yd":
                return parseInt(inputValue) * 1;
                break;
            case "ft":
                return parseInt(inputValue) * 3;
                break;
            case "ic":
                return parseInt(inputValue) * 36;
                break;
            case "ntm":
                return parseInt(inputValue) * 0.000493737;
                break;

        }

    }
    if (input1 == "ft") {
        switch (input2) {

            case "km":
                return parseInt(inputValue) * 0.0003048;
                break;
            case "m":
                return parseInt(inputValue) * 0.3048;

                break;
            case "cm":
                return parseInt(inputValue) * 30.48;
                break;
            case "mm":
                return parseInt(inputValue) * 304.8;
                break;
            case "mc":
                return parseInt(inputValue) * 304800;
                break;
            case "nm":
                return parseInt(inputValue) * 304800000;
                break;
            case "ml":
                return parseInt(inputValue) * 0.000189394;
                break;
            case "yd":
                return parseInt(inputValue) * 0.333333;
                break;
            case "ft":
                return parseInt(inputValue) * 1;
                break;
            case "ic":
                return parseInt(inputValue) * 12;
                break;
            case "ntm":
                return parseInt(inputValue) * 0.000164579;
                break;

        }

    }


    if (input1 == "ic") {
        switch (input2) {

            case "km":
                return parseInt(inputValue) * 0.0000254;
                break;
            case "m":
                return parseInt(inputValue) * 0.0254;

                break;
            case "cm":
                return parseInt(inputValue) * 2.54;
                break;
            case "mm":
                return parseInt(inputValue) * 25.4;
                break;
            case "mc":
                return parseInt(inputValue) * 25400;
                break;
            case "nm":
                return parseInt(inputValue) * 25400000;
                break;
            case "ml":
                return parseInt(inputValue) * 0.000015783;
                break;
            case "yd":
                return parseInt(inputValue) * 0.0277778;
                break;
            case "ft":
                return parseInt(inputValue) * 0.0833333;
                break;
            case "ic":
                return parseInt(inputValue) * 1;
                break;
            case "ntm":
                return parseInt(inputValue) * 0.000013715;
                break;

        }

    }

    if (input1 == "ic") {
        switch (input2) {

            case "km":
                return parseInt(inputValue) * 0.0000254;
                break;
            case "m":
                return parseInt(inputValue) * 0.0254;

                break;
            case "cm":
                return parseInt(inputValue) * 2.54;
                break;
            case "mm":
                return parseInt(inputValue) * 25.4;
                break;
            case "mc":
                return parseInt(inputValue) * 25400;
                break;
            case "nm":
                return parseInt(inputValue) * 25400000;
                break;
            case "ml":
                return parseInt(inputValue) * 0.000015783;
                break;
            case "yd":
                return parseInt(inputValue) * 0.0277778;
                break;
            case "ft":
                return parseInt(inputValue) * 0.0833333;
                break;
            case "ic":
                return parseInt(inputValue) * 1;
                break;
            case "ntm":
                return parseInt(inputValue) * 0.000013715;
                break;

        }

    }
    if (input1 == "ntm") {
        switch (input2) {

            case "km":
                return parseInt(inputValue) * 1.852;
                break;
            case "m":
                return parseInt(inputValue) * 1852;

                break;
            case "cm":
                return parseInt(inputValue) * 185200;
                break;
            case "mm":
                return parseInt(inputValue) * 1852000;
                break;
            case "mc":
                return parseInt(inputValue) * 1852000000;
                break;
            case "nm":
                return parseInt(inputValue) * 1852000000000;
                break;
            case "ml":
                return parseInt(inputValue) * 1.15078;
                break;
            case "yd":
                return parseInt(inputValue) * 2025.37;
                break;
            case "ft":
                return parseInt(inputValue) * 6076.12;
                break;
            case "ic":
                return parseInt(inputValue) * 72913.4;
                break;
            case "ntm":
                return parseInt(inputValue) * 1;
                break;

        }

    }

}
<!doctype html>
<html>
<head>
    <title>Length Unit Converter</title>
    
   <script src="popup.js"></script>
</head>

<body>
<h1>Lenght Unit Converter</h1>
<input type="text" name="inputText" id="inputValue" required onfocus="clearTextBox()">
<select id="list1" onchange="getSelectValue1()">
                <option value="km">Kilometre</option>
                <option value="m">Metre</option>
                <option value="cm">Centimetre</option>
                <option value="mm">Millimetre</option>
                <option value="mc">Micrometre</option>
                <option value="nm">Nanometre</option>
                <option value="ml">Mile</option>
                <option value="yd">Yard</option>
                <option value="ft">Foot</option>
                <option value="ic">Inch</option>
                <option value="ntm">Nautical mile</option>


            </select>
<br>
 <input id="display" type="text" name="display" readonly>
            <select id="list2" onchange="getSelectValue2()">
                <option value="km">Kilometre</option>
                <option value="m">Metre</option>
                <option value="cm">Centimetre</option>
                <option value="mm">Millimetre</option>
                <option value="mc">Micrometre</option>
                <option value="nm">Nanometre</option>
                <option value="ml">Mile</option>
                <option value="yd">Yard</option>
                <option value="ft">Foot</option>
                <option value="ic">Inch</option>
                <option value="ntm">Nautical mile</option>
            </select>
</br>
<br><input type="button" value="convert" onclick="setValueToTextBox()"></br>


</body>
</html>

** Но когда я загружаю его в браузер Google Chrome ... это выглядит нормально, как я ожидал. Скриншот приведен ниже! введите описание изображения здесь

мое расширение выглядит так, как я ожидал, но его функции не работают, как обычные программы html и javascript. Пожалуйста, помогите мне решить эту проблему !!! заранее спасибо!

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...