根据 Select 选项触发 JS 函数

Question

我有一个简单的 HTML select 选项框和一个 javascript 函数。我目前使用链接和按钮的功能使用 onClick 事件触发器。

我想使用 Select 选项来触发函数。 函数（例如，platform() 在嵌入式仪表板上触发过滤器。我想要获取值 selected 并应用关联函数（例如，platform()）过滤嵌入式仪表板的新函数。我不想显示 selected 的内容。

这只是我的 HTML 和 jS 文件的摘录 - 其中包括所有适当的资源链接，例如 jQuery.

我该怎么做？

注意： Select 选项中包含的每个值目前都有类似的功能。为了提出问题，我只包括了一个。其他函数仅在名称和对应于选项 Select 提供的值

的值上有所不同

<!DOCTYPE html>
<html>
    <body>

        <form>                    
            <h3>Color Detail</h3>
            <br>
            <p>Select the level of detail to depict by color.</p>
            <select id="select_a" name="color">
                <option value="Organization">Organization</option>
                <option value="Parent Organization">Parent Organization</option>
                <option value="Parent Organization">Parent Organization</option>           
                <option value="Market">Market</option>
                <option value="Segment">Segment</option>
                <option value="Program">Program</option>
                <option value="Platform">Platform</option>
            </select>            
        </form>

        <script>
            function platform() {
                mainWorkbook = mainViz.getWorkbook();
                // Set to Detail to Platform (aka Type)
                mainWorkbook.changeParameterValueAsync('Color Detail', 'Platform').then(function () {
                    alertOrConsole("'Color Detail' parameter set to Platform");
                });
            };
        </script>
    </body>
</html>

Answer 1

在更改事件中使用

$("#select_a").on('change', function(){
    var selectedVal = $(this).val();
    switch(selectedVal){
        case 'Parent Organization':
            organization();
        break;
        case 'Market':
            market();
        break;
        case 'Segment':
            segment();
        break;
        case 'Program':
            program();
        break;
        case 'Platform':
            platform();
        break;
    }
});

根据 Select 选项触发 JS 函数

Trigger JS Function based on Select Option

javascript

jquery

select

tableau-api