使用 Jade 的下拉项中的可点击链接

Clickable links in drop-down items using Jade

我正在使用 Node.js、Jade 和 Node 包 XLSX(针对 Excel)创建一个简单的下拉菜单,该菜单使用 Excel 中的 sheet 个名称] 文档作为下拉菜单的字段。例如,如果不同的 sheet 名称是一年中的所有月份,我希望所有这些月份都是菜单中的可点击链接。

到目前为止,我已经能够将 Excel 文件中的 sheet 名称放入下拉菜单中,但我不确定如何使它们成为所有可点击的链接。

index.js

   router.get('/', function(req, res, next) {
    var workbook = xlsx.readFile('C:/Users/user/Desktop/1234.xlsx');


  var listStuff = [];
  _.each(workbook.SheetNames, function(value, key, collection) {

  listStuff.push(value);
   // console.log(value);
})

index.jade

   select
     each val in listStuff
     option=val
     a(href='https://www.google.ca')=val     /*need to fix this line so that   all the values are links instead of just being a static drop down menu  */

我一开始没意识到您使用的是 select 元素。为了将 link 应用于 select 元素,您必须使用 javascript。这样的东西应该可以工作。

select(id="foo", name="xxxyyy")
 -for(var i = 1;i<10;i++){
 option(value="https://www.google.ca") Some value for #{i}
 -}

script.
 document.getElementById("foo").onchange = function() {
    if (this.selectedIndex!==0) {
        window.location.href = this.value;
    }        
 };

Codepen 不允许 links 但如果你去这里 http://codepen.io/chrislewispac/pen/epvgGb 然后打开控制台,您会看到它正在 linking.

对于您的comment/question,下面是您需要的确切代码:

更新的 CodePen: http://codepen.io/chrislewispac/pen/epvgGb

- var listStuff = ['thing','thing2','thing3']

select(id="foo", name="xxxyyy")
each val, i in listStuff
option(value="https://www.google.ca") Value is: #{val}

script.
document.getElementById("foo").onchange = function() {
    if (this.selectedIndex!==0) {
        window.location.href = this.value;
    }        
};

请注意,您不需要在代码中将 var listStuff 声明为数组,因为您已经从服务器获得了它。