Question

您好，我正在尝试从搜索栏中重定向搜索结果，但是它将所有搜索结果返回到我在函数中所做的最后一个语句

这是用于搜索重定向的JS

              var inputSearchCalc = document.querySelector('#calculatorSearch').value;
        var searchCalcBtn = document.querySelector('#search-calculator-index');

        function searchCalc() {
            if (inputSearchCalc = 'Algebra') {
                window.location = '/educationSec/calculatorSubjects/algebra/algebra.html'
            } 
            if (inputSearchCalc = 'Analytical Chemistry') {
                window.location = '/educationSec/calculatorSubjects/AChem/AChem.html'
            } 
            if (inputSearchCalc ='Chemistry') {
                window.location = '/educationSec/calculatorSubjects/chemistry/chemistry.html'
            } 
            if (inputSearchCalc = 'Economics') {
                window.location = '/educationSec/calculatorSubjects/economics/economics.html'
            }
            if (inputSearchCalc = 'Financial Accounting') {
                window.location = '/educationSec/calculatorSubjects/finAccounting/finAccounting.html'
            }
            if (inputSearchCalc = 'Geometry') {
                window.location = '/educationSec/calculatorSubjects/geometery/geometery.html'
            }
            if (inputSearchCalc = 'Managerial Accounting') {
                window.location = '/educationSec/calculatorSubjects/manAccounting/manAccounting.html'
            }
            if (inputSearchCalc = 'Organic Chemistry') {
                window.location = '/educationSec/calculatorSubjects/organicChem/organicChem.html'
            }
            if (inputSearchCalc = 'Physics') {
                window.location = '/educationSec/calculatorSubjects/physics/physics.html'
            }
            if (inputSearchCalc = 'Precalculus') {
                window.location = '/educationSec/calculatorSubjects/precalc/precalc.html'
            } 
        }

     searchCalcBtn.addEventListener('click' , searchCalc);

所有结果都重定向到最后一个的precalc页面

Answer 1

这里是将方法转换为开关的示例。注意：我更改了函数以将searchParam作为参数，这使您可以测试代码并封装该函数。

function searchCalc(searchParam) {
  let urlBase = '/educationSec/calculatorSubjects/';
  switch (searchParam) {
    case 'Algebra':
      urlBase += 'algebra/algebra.html';
      break;
    case 'Analytical Chemistry':
      urlBase += 'AChem/AChem.html';
      break;
    case 'Chemistry':
      urlBase += 'chemistry/chemistry.html';
      break;
    case 'Economics':
      urlBase += 'economics/economics.html';
      break;
    case 'Financial Accounting':
      urlBase += 'finAccounting/finAccounting.html';
      break;
    case 'Geometry':
      urlBase += 'geometery/geometery.html';
      break;
    case 'Managerial Accounting':
      urlBase += 'manAccounting/manAccounting.html';
      break;
    case 'Organic Chemistry':
      urlBase += 'organicChem/organicChem.html';
      break;
    case 'Physics':
      urlBase += 'physics/physics.html';
      break;
    case 'Precalculus':
      urlBase += 'precalc/precalc.html';
      break;
    default: 
      urlBase += '404.html';
      break;
  }
  return urlBase;
}

console.log(searchCalc("Organic Chemistry"));
console.log(searchCalc("Wrong Search"));

Answer 2

星期五和保罗的回答都很棒。单“ =”甚至使经验丰富的程序员无时无刻不在旅行。无论您使用哪种编程语言，花一点时间在每种形式的赋值和测试您可能要处理的任何类型的对象（例如整数，实数，字符串，对象，指针，类型，结构等。

我喜欢开关能很好地曝光。

我喜欢的另一件事是人们如何拆分baseURL。变量名是完美的。它使代码更易于理解和维护。

杰克的回应是我的最爱。他的代码不仅简单而不牺牲正确性或完整性，而且可以将这些数据打包到主程序外部的JSON配置文件中或数据库中。它使调试，测试和错误处理更易于根据需要实施。

即使对于简单的临时一次性应用程序，这也允许您将所有配置数据放在程序顶部，以便可以根据需要复制，编辑和重新运行该程序。

Answer 3

在函数触发之前获取值，因此它返回空值。您应该在调用函数后获取值，并使用双等于==或===来比较两个值而不是单个赋值运算符=。现在工作正常

var educationList = document.querySelector('#educationListOutput');

        educationList.innerHTML = industries;

        //var inputSearchCalc = document.querySelector('#calculatorSearch').value;
        var inputSearchCalc = document.querySelector('#calculatorSearch');

         var searchCalcBtn = document.querySelector('#search-calculator-index');


            function searchCalc() {

                inputSearchCalc = inputSearchCalc.value; //Added this line

                if (inputSearchCalc == 'Algebra') {
                    window.location = '/educationSec/calculatorSubjects/algebra/algebra.html'
                } 
                if (inputSearchCalc == 'Analytical Chemistry') {
                    window.location = '/educationSec/calculatorSubjects/AChem/AChem.html'
                } 
                if (inputSearchCalc =='Chemistry') {
                    window.location = '/educationSec/calculatorSubjects/chemistry/chemistry.html'
                } 
                if (inputSearchCalc == 'Economics') {
                    window.location = '/educationSec/calculatorSubjects/economics/economics.html'
                }
                if (inputSearchCalc == 'Financial Accounting') {
                    window.location = '/educationSec/calculatorSubjects/finAccounting/finAccounting.html'
                }
                if (inputSearchCalc == 'Geometry') {
                    window.location = '/educationSec/calculatorSubjects/geometery/geometery.html'
                }
                if (inputSearchCalc == 'Managerial Accounting') {
                    window.location = '/educationSec/calculatorSubjects/manAccounting/manAccounting.html'
                }
                if (inputSearchCalc == 'Organic Chemistry') {
                    window.location = '/educationSec/calculatorSubjects/organicChem/organicChem.html'
                }
                if (inputSearchCalc == 'Physics') {
                    window.location == '/educationSec/calculatorSubjects/physics/physics.html'
                }
                if (inputSearchCalc == 'Precalculus') {
                    window.location = '/educationSec/calculatorSubjects/precalc/precalc.html'
                } 
            }

Answer 4

最简单的方法是解决if语句问题（您正在分配不进行比较-应该使用==而不是=），并使代码更小，将使用一个对象。添加此内容：

var subjectURLs = {
    'Algebra': 'algebra/algebra.html',
    'Analytical Chemistry': 'AChem/AChem.html',
    'Chemistry': 'chemistry/chemistry.html',
    'Economics': 'economics/economics.html',
    'Financial Accounting': 'finAccounting/finAccounting.html',
    'Geometry': 'geometery/geometery.html',
    'Managerial Accounting': 'manAccounting/manAccounting.html',
    'Organic Chemistry': 'organicChem/organicChem.html',
    'Physics': 'physics/physics.html',
    'Precalculus': 'precalc/precalc.html'
}

const baseURL = '/educationSec/calculatorSubjects/';

然后使用您的代码执行此操作：

function searchCalc(search) {
    window.location = baseURL + subjectURLS[search];
}

示例（console.log到位，因此您可以看到输出）：

var subjectURLs = {
    'Algebra': 'algebra/algebra.html',
    'Analytical Chemistry': 'AChem/AChem.html',
    'Chemistry': 'chemistry/chemistry.html',
    'Economics': 'economics/economics.html',
    'Financial Accounting': 'finAccounting/finAccounting.html',
    'Geometry': 'geometery/geometery.html',
    'Managerial Accounting': 'manAccounting/manAccounting.html',
    'Organic Chemistry': 'organicChem/organicChem.html',
    'Physics': 'physics/physics.html',
    'Precalculus': 'precalc/precalc.html'
}

const baseURL = '/educationSec/calculatorSubjects/';

function searchCalc(search) {
    console.log(baseURL + subjectURLs[search]);
}
    
searchCalc("Algebra");
searchCalc("Physics");

希望这会有所帮助！

数据列表和结果重定向遇到麻烦

4 个答案: