Jquery 下拉选择将文本框滑动到右侧，使其成为必需，如果选择了其他选项，则撤消

我试图弄清楚如何根据所选的下拉列表显示、隐藏和生成必填字段或不使用jQuery

我有一个下拉列表，如下所示：

我想做的是，当从下拉列表中选择Other时，我希望Other文本框（#other1）滑到它的右侧，并使该文本框成为必需的

但是如果从下拉列表中选择了另一个选项，我希望它滑回并隐藏，使文本框不再需要

我无法找到编写此JavaScript的正确方法，因此非常感谢您的帮助

$（document）.on（'change'，'#boatfuel'，function（）{
var other1=$（“#other1”）；
var boatFuelOther=$（“boatFuelOther”）
if（$（this.val（）=='Other'）{
boatFuelOther.slideRight（）；
其他1.道具（“必需”，真实）；
}否则{
boatFuelOther.slideLeft（）.hide（）；
其他1.道具（“必需”，错误）；
}
});

燃料：
选择燃料
煤气
柴油机
电的
其他
其他：
您最好的选择就是这样显示和隐藏：


否则，当我向右滑动然后隐藏它，使它再次向右滑动时，如果用户来回切换，我往往会遇到问题。使用以下代码：

$(this).show("slide", { direction: "right" }, 1000);
$(this).hide("slide", { direction: "left" }, 1000);


$（document）.on（'change'，'#boatfuel'，function（）{
var other1=$（“#other1”）；
if（$（this.val（）=='Other'）{
其他1.show（）；
其他1.道具（“必需”，真实）；
}否则{
其他1.隐藏（）；
其他1.道具（“必需”，错误）；
}
});

燃料：
选择燃料
煤气
柴油机
电的
其他
其他：