Is there a way to disable text for a drop down menu?

I'm trying to make a text field that has a drop down menu, but the user is only able to select options from the drop down menu. I want to disable the user's ability to type in the text box, while still allowing them to select an option, but I don't know how to do that. I've tried disable and readonly, but neither do what I want, although it is possible that I am using these attributes wrong.

Edit I realized two mistakes in my original question. I meant disabled instead of disable, and I also meant text input instead of text field.

Why you want to have a text field, you can simply use select tag

<label for="cars">Choose a car:</label>

<select name="cars" id="cars" oninput="myFunc(this)">
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select>

This will create a dropdown. You can attach the value to a div to show it

function myFunc(selected){       
    //you can replace the divId below by your div's id
    document.getElementById("divId").innerHTML=selected.value;
}

Or you can use input type="radio"