HtmlService表单 - 动态DropdownList

Question

我有一个HtmlService表单，它从用户获取数据。

表单中有多个dropdownlist。

如果用户已经在第一个dropdownlist中选择了，是否可以从后续的dropdownlist中消除选择？ google.script.run能做到吗？

Answer 1

您正在寻找的可以使用JavaScript在网页上完成，没有必要使用google.script.run与服务器进行任何调用。下面是一个JSfiddle的例子，你可以点击一个下拉列表，并使用JQuery显示一个网站的新部分：https://jsfiddle.net/rorfw6mb/1/

这应该告诉你一个基本的方法，你可以在页面上显示不同的元素用户选择。

var optionsTemplates = { 
 
    'Option 1': '<span>Option 1 selected</span>', 
 
    'Option 2': '<span>Option 2 selected</span>', 
 
    'Option 3': '<span>Option 3 selected</span>', 
 
    'Option 4': '<span>Option 4 selected</span>' 
 
}; 
 

 
$('select').on('change', function(){ 
 
    let value = $(this).val(); 
 
    console.log(value); 
 
    if(value !== ''){ 
 
    $('#option-container').removeClass('hidden'); 
 
    $('#option-container').html(optionsTemplates[value]); 
 
    } else { 
 
    \t $('#option-container').addClass('hidden'); 
 
    } 
 
})

#option-container.hidden { 
 
    display: none; 
 
} 
 

 
#option-container { 
 
    margin: 5px; 
 
    border: 2px solid blue; 
 
    width: auto; 
 
    display:inline; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select> 
 
    <option></option> 
 
    <option value="Option 1">Option 1</option> 
 
    <option value="Option 2">Option 2</option> 
 
    <option value="Option 3">Option 3</option> 
 
    <option value="Option 4">Option 4</option> 
 
</select> 
 

 
<div id="option-container" class="hidden"> 
 
    
 
</div>