在选择相关的下拉选项之前，如何在页面加载时默认隐藏文本字段？

在选择相关的下拉选项之前，可以通过CSS样式来实现在页面加载时默认隐藏文本字段。具体的方法是使用display属性将文本字段设置为none，然后在选择相关的下拉选项时，通过JavaScript或jQuery等脚本语言来动态修改display属性，将文本字段显示出来。

以下是一个示例代码：

HTML代码：

<select id="dropdown">
  <option value="option1">Option 1</option>
  <option value="option2">Option 2</option>
  <option value="option3">Option 3</option>
</select>

<input type="text" id="textfield" style="display: none;">

JavaScript代码（使用原生JavaScript）：

window.onload = function() {
  var dropdown = document.getElementById("dropdown");
  var textfield = document.getElementById("textfield");

  dropdown.addEventListener("change", function() {
    if (dropdown.value !== "") {
      textfield.style.display = "block";
    } else {
      textfield.style.display = "none";
    }
  });
};

上述代码中，通过window.onload事件来监听页面加载完成的事件，获取下拉选项和文本字段的DOM元素。然后通过addEventListener方法来监听下拉选项的change事件，当下拉选项的值不为空时，将文本字段的display属性设置为block，即显示出来；当下拉选项的值为空时，将文本字段的display属性设置为none，即隐藏起来。

这样，在页面加载时，默认隐藏文本字段，只有在选择相关的下拉选项后，文本字段才会显示出来。

注意：以上代码仅为示例，实际应用中可能需要根据具体情况进行修改和调整。