節點，Express，Jade下拉列表

Question

我的代碼如下：問題是：

如何使我的Jade文件根據選擇菜單的值呈現事件的描述？ 基本上，如果select選項的值為1，則p應該呈現p＃{event [1] .description}。

考慮到Jade預編譯，我無權訪問DOM，從而消除了document.getElementbyId("test").selectedIndex; 下面是我在服務器端解決此問題的嘗試。 我想我雖然缺少一些東西，因為對我而言，無論采用哪種方法，我都需要訪問DOM才能在選擇菜單中看到值更改以吐出“事件描述”。

任何幫助，將不勝感激。

玉銼

    extends layout

block content

    form(role='form', action="/doSomthing", method="post")
      select#test.form-control(name = "choices")
        each events, i in event
         option(value=i) #{events.event}
      button.btn.btn-default(type='submit') Submit
        
      a(href='/')
      button.btn.btn-primary(type="button") Cancel

    p#{events[0].description} //I want to pass an array instead of explicitly  calling [0]

路線

router.get('/eventreg', function(req, res) {
    var ei = event.eventid;
    var eiarray = Event.findOne({'eventid': cc });

    Event.find({}, function(err, event){
        res.render('eventreg', {user : req.user, event: event});
        console.log(event);
        console.log(eiarray);
    });
});

我的想法是我可以在服務器端創建循環數組，以便對其進行編譯，但是一旦頁面已呈現並且我更改了所選的選項值，它就不會立即進行重新編譯。

React能解決這個問題嗎？ 似乎有點矯kill過正。

再次感謝大家的寶貴時間。

Answer 1

您可以在頁面上添加一段JavaScript，然后在瀏覽器中進行所需的文本更改。 在Jade頁面的底部添加以下內容：

script.
  $('#theOptionField').on('change', function(e) {
    // get value that the user selected
    // modify the HTML of the element that should display the value
  });