שינוי טקסט בתגית העלאת קובץ

בתגית העלאת קובץ input type file לא ניתן לשנות את השם של של העלאה של הקבצים

כמה דוגמאות לעשות את זה

https://stackoverflow.com/questions/1944267/how-to-change-the-button-text-of-input-type-file

משהו שאני עשיתי שקצת יותר נחמד לדעתי + התייחסות לעיניין של הטקסט של אחרי השינוי

 

js
  file_name_text = jQuery('#form-field-field_1').val().split("\\").pop();
  if (file_name_text == "" ) {
  file_name_text = "בחר קובץ";
  } 
  $('.elementor-field-group-demo').append('<span class="file_name">'+file_name_text+'</span>');	
  
  $('#form-field-field_1').on("change",function() {
  $('.file_name').html(jQuery('#form-field-field_1').val().split("\\").pop());
  });

  $('#form-field-demo').disabled = true;	
  $(".elementor-field-group-demo").click(function () {
  $("#form-field-field_1").trigger('click');
  
});
  
css
.elementor-field-group-field_1 {
  display:none !important;
}
.file_name {
  font-size:12px;
}
#form-field-demo {
  width:20%;
  text-align: center;
  cursor: pointer;
  background:transparent;
  color:black;
  margin-left:10px;
  font-weight:bold;	
}

 

מבוסס על אלמנטור ששם הוספתי חוץ מה file עוד שדה טקסט ושמתי לו id שנקרא demo וזהו בערך משהו קטן נוסף ב js ניתן להוציא איבר אחרון ע"י pop השתמשתי בזה, יכול להיות מאוד שימושי.