Javascript 在选择下拉列表中隐藏文件扩展名（html/css）

我有一个select下拉列表，其中动态填充了ovpn文件，因此它显示了，例如，United Kingdom.ovpn

我想隐藏.ovpn文件扩展名，但我无法使用下面的脚本，它似乎适用于常规html

表单元素：

<select class="selectpicker1" name="ovpn-filename" id="ovpn-filename"></select>

我用来尝试隐藏文件扩展名（.ovpn）的脚本，它当前附加到一个按钮：

<button onclick="myFunction()">Hide Extension</button>

<script>
function myFunction()
{
var str=document.getElementById("ovpn-filename").innerHTML; 
var n=str.replace(".ovpn"," ");
document.getElementById("ovpn-filename").innerHTML=n;
}
</script>

隐藏扩展名
函数myFunction（）
{
var str=document.getElementById（“ovpn文件名”）.innerHTML；
var n=str.replace（“.ovpn”，”）；
document.getElementById（“ovpn文件名”）.innerHTML=n；
}

结果是“测试” 拆下最后5个字符 试试这个概念……像你一样改变。

试试这个

<button onclick="myFunction()">Hide Extension</button>

<script>
function myFunction()
{
var str=document.getElementById("ovpn-filename").innerHTML; 
var n=str.replace(/.ovpn/g," ");
document.getElementById("ovpn-filename").innerHTML=n;
}
</script>

---

它将只替换第一次出现的.ovpn

您可以使用jquery实现它：

 <script>
    var optionString = '';  // declare a string to hold all options
    $("#ovpn-filename option").each(function()
    {
        var str=$(this).val(); 
        var n=str.replace(".ovpn"," ");      //remove .ovpn string        
        optionString +=  '<option>'+n+'</option>';  //add back to that option 
    });
    $('#ovpn-filename').html(optionString );  //assign all option html back to select
    </script> 

变量选项字符串=“”；//声明一个字符串以保存所有选项
$（“#ovpn文件名选项”）。每个（函数（）
{
var str=$（this.val（）；
var n=str.replace（“.ovpn”，”）；//删除.ovpn字符串
optionString+=''+n+''；//添加回该选项
});
$（'#ovpn filename'）.html（optionString）//将所有选项html重新分配给select

jQuery不可用？是否使用ajax调用获取下拉列表值？如果是，您可以在php代码中使用rtrim（）来删除“.ovpn”。请看这里：如果您已经尝试过，您的问题是什么？您是否完全失败或部分失败了？什么？谢谢，我希望使用这种方法，但我正在努力使其工作。我已经用填充下拉选项的脚本修改了我的问题，因为我认为用您在这里使用的方法修改它将提供解决方案，但我不确定我到底做错了什么。将此代码添加到您的按钮单击函数中，首先在不单击按钮的情况下对其进行简单测试

var n=str.replace(".ovpn"," ");

 <script>
    var optionString = '';  // declare a string to hold all options
    $("#ovpn-filename option").each(function()
    {
        var str=$(this).val(); 
        var n=str.replace(".ovpn"," ");      //remove .ovpn string        
        optionString +=  '<option>'+n+'</option>';  //add back to that option 
    });
    $('#ovpn-filename').html(optionString );  //assign all option html back to select
    </script>