click specific option using javascript or jquery-CodePudding

I tried googling this but I am getting only on event trigger searches instead of what I am looking for.

I want to dynamically click on any of the options in the select dropdown by using the value or the text if possible.

HTML

<select id="certainspamselectid" name="certainspamselect" style="margin-left: 165px;">
   <option value="0">permanently deleted</option>
   <option value="4">moved to admin quarantine</option>
   <option value="1">moved to junk email folder</option>
   <option value="5">delivered to inbox with tag</option>
   <option value="2">delivered to inbox</option>
</select>

I am not sure if I need to use something with $("#certainspamselectid").click..... but I am not sure what to use after click. I would have tried more things but my google searches keep pinpointing me for on event triggers when I just want to click on one of these options using either JS or jQuery.

CodePudding user response：

I have read your problem and honestly, I can't understand what you want exactly. However, it looks like you want to select some certain option of the select dropdown. If that's right, you don't need to call some kind of click function.

You can do it easily with jQuery.

For example, imagine that you are going to select third option - "moved to junk email folder". Then you can select it by code like below.

$("#certainspamselectid").val(1);

If my answer is not enough for you, let me know detail of your problem.

CodePudding user response：

With <select> what you need is .change instead of .click Here is a quick example .. change the $value and check again

$("#certainspamselectid").on('change' , function(){
  console.log("Value Changed To: " $(this).val());
  
  if($(this).val() == 5){
    console.log("value 5 is selected");
  }
});

let $value = 4;
$("#certainspamselectid").val($value).change();

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select id="certainspamselectid" name="certainspamselect" style="margin-left: 165px;">
   <option value="0">permanently deleted</option>
   <option value="4">moved to admin quarantine</option>
   <option value="1">moved to junk email folder</option>
   <option value="5">delivered to inbox with tag</option>
   <option value="2">delivered to inbox</option>
</select>

CodePudding user response：

why don't you simply change the value of the select like this

$("#certainspamselectid").val(4)

It will automatically show the text from the selected option

I don't think that clicking on an option would help you