所選插件的佔位符文本，用於單個選擇不起作用

我在我的代碼中實現了單選的插件。我試圖爲搜索框添加佔位符文本，但我無法。我曾嘗試以下的事情：所選插件的佔位符文本，用於單個選擇不起作用

<select id="search_pi" name="search_pi" type="text" class="chosen-select" 
     style="width:450px;" onchange="this.form.submit()" > 

    <option value="">Search Project/Initiative...</option> 
    <?php 
    include "../includes/search_dropdown.php"; 
    foreach($proj_ini_Array as $qa){ 
     echo "<option value = \"$qa\">$qa</option>"; 
    } 
    ?>

<script> 
    $(document).ready(function() { 
    $('.chosen-select').chosen({ 
     placeholder_text_single: "Select an option", 
     no_results_text: "Oops, nothing found!" 
    }); 
    }); 
</script>

選擇欄，我使用data-placeholder="Select an option"也試過，但沒有幫助過。有人能讓我知道我錯過了什麼嗎？

在此先感謝。

來源

2013-11-25 rond

佔位符文本？你的意思只是在第一個'

是的，確切地說。表單框中突出顯示的文本。 – rond

好的。我找到了答案。我們需要將第一個選項設爲空白，以便爲單選搜索框激活佔位符文本。

<select id="search_pi" name="search_pi" type="text" class="chosen-select" style="width:450px;" onchange="this.form.submit()" > 

    <option> </option> 
    <?php 
    include "../includes/search_dropdown.php"; 
    foreach($proj_ini_Array as $qa){ 
     echo "<option value = \"$qa\">$qa</option>"; 
    } 
    ?>

在上述情況下，佔位符文本將默認爲「選擇一個選項」。

對於自定義的佔位符文本爲一個單一的搜索選擇框，您可以編輯您的js文件，如下，並有空白佔位符文本的第一個選項，以顯示：

<script> 
    $(document).ready(function() { 
    $('.chosen-select').chosen({ 
     placeholder_text_single: "Select Project/Initiative...", 
     no_results_text: "Oops, nothing found!" 
    }); 
    }); 
</script>

來源

2013-12-03 23:51:32 rond

爲了使您的第一個選項只是一個指導文本，但無法爲用戶選擇它，使用：

<option selected="selected" disabled>Search Project/Initiative...</option>

*編輯*

不好意思啊，沒看過你的問題足夠清楚的開始。

顯然第一個<option>需要是空的。見this jsfiddle。

來源

2013-11-25 18:54:26 t0mppa

這絕對聽起來像一個選項...但我更願意使用選擇優惠的佔位符文本功能。看看這個鏈接http://harvesthq.github.io/chosen/options.html – rond

@rond：見編輯答案。 :) – t0mppa

@ tOmppa-我想到了:)但我無法回答我自己的問題:(我們不必將第一個選項保留爲多選框。 – rond

使用data-placeholder="YOUR TEXT"在select標籤

來源

2014-12-16 12:02:30

謝謝！它幫助了我!! :) –

如果您是通過HTML而不是JS構建的，實際上有一個更好/更簡單的解決方案。你必須做兩件事。

您的<select>中的第一個<option>應該爲空。
您應該在您的<select>中包含placeholder="Placeholder goes here"。顯然這曾被稱爲data-placeholder，我認爲這導致了一些混淆。

所以，在總：

<select placeholder="Placeholder goes here"> 
    <option><!-- Empty option goes here. --><option> 
    <option>Other Option</option> 
</select>

來源

2015-12-16 15:53:17

用戶響應@Zack Joerdan解決我的問題。所以選項內彈簧需求值

<select placeholder="Placeholder goes here"> 
    <option value=""><!-- Empty option goes here. --><option> 
    <option>Other Option</option> 
</select>

來源

2017-05-11 18:18:19

所選插件的佔位符文本，用於單個選擇不起作用

回答

相關問題