jQuery Force ustawia atrybut src dla iframe

83

Mam stronę główną (właściwie JSP) z ramką iframe wewnątrz niej jako;

<iframe name="abc_frame" id="abc_frame" src="about:blank" frameborder="0" scrolling="no"></iframe>

Teraz na stronie głównej znajduje się wiele linków (renderowanych dynamicznie przez JSP), które mogą próbować ustawić src na jakiś adres URL ...

Teraz moje pytanie brzmi, używając jQuery (może to być live ()), czy mogę zmienić to w taki sposób, aby atrybut „src” dla abc_frame zawsze miał jakąś określoną wartość (np. „SomefixedURL”)

Nie mogę przechwycić kliknięcia linku, ponieważ jest on całkowicie dynamicznie tworzony przez jakiś kod Java i dlatego próbuję zastąpić iframe src?

javascript jquery dom testndtv
źródło

Odpowiedzi:

166

Użyj atr

$('#abc_frame').attr('src', url)

W ten sposób możesz pobrać i ustawić każdy atrybut znacznika HTML. Zauważ, że jest też .prop(). Zobacz .prop () vs .attr () o różnicach. Wersja skrócona: .attr()jest używana w przypadku atrybutów, ponieważ są one zapisane w kodzie źródłowym HTML i .prop()dotyczy całego kodu JavaScript dołączonego do elementu DOM.

PiTheNumber
źródło
Powodem, dla którego to nie zadziała, jest to, że po załadowaniu strony inny link zmieniłby src na nową wartość ...
testndtv
Jeśli umieścisz kod na końcu pliku, kod zostanie wykonany po innych skryptach. Jeśli problem jest tworzony przez określony link, który kliknie użytkownik, możesz dodać drugie zdarzenie onclick do łącza. W przeciwnym razie musisz użyć setTimout / setInterval i wielokrotnie sprawdzać wartość src (brzydko!).
PiTheNumber
20

jeśli używasz jQuery 1.6 i nowszych , chcesz użyć .prop () zamiast.attr():

$('#abc_frame').prop('src', url)

Zobacz to pytanie, aby wyjaśnić różnice.

kalyfe
źródło
4
Ciekawy link, ale pamiętaj, że odpowiedź została zaktualizowana, ponieważ jQuery przywrócił attr() zachowanie. Ogólnie rzecz biorąc, nie zgodziłbym się na użycie .prop()tutaj, ponieważ srcjest to atrybut, a nie właściwość, jak .prop()wyjaśnia dokumentacja API dla ciebie, do której prowadzi łącze.
PiTheNumber,
9

Podczas generowania linków ustaw cel na właściwość nazwy iframes i prawdopodobnie nie będziesz musiał w ogóle zajmować się jquery.

<a href="inventory.aspx" target="contentframe"  title="Title Inventory">
<iframe id="iframe1" name="contentframe"  ></iframe>
Brian Rizo
źródło
Jeśli to możliwe, dobrze jest używać rodzimej metody przeglądarki, ale myślę, że użytkownik ma dynamiczne linki, dlatego musi przechwytywać atr kliknięcia.
efwjames,
Jak dynamiczny? Podczas generowania strony po prostu ustaw href na cokolwiek potrzebujesz. Lub nawet przy ładowaniu domeny po prostu ustaw atrybut href, jeśli musisz. Chodzi o to, aby nie musieć obsługiwać właściwości src elementu iframe, a to sprawia, że ​​jest to możliwe.
Brian Rizo,
8 
$(document).ready(function() {
    $('#abc_frame').attr('src',url);
})
Jayendra
źródło
5

Ustawienie atrybutu src nie działa dla mnie. Element iframe nie wyświetlał adresu URL.

U mnie zadziałało:

window.open(url, "nameof_iframe");

Mam nadzieję, że to komuś pomoże.

Hari
źródło
ustawienie z .attr () również nie działało dla mnie. To jednak działa
Andy N
3 
<script type="text/javascript">
  document.write(
    "<iframe id='myframe' src='http://www.example.com/" + 
    window.location.search + "' height='100' width='100%' >"
  ) 
</script>

Ten kod pobiera parametry url (? A = 1 & b = 2) ze strony zawierającej element iframe i dołącza je do podstawowego adresu URL elementu iframe. Działa na moje potrzeby.

Arend
źródło
document.writejest równoznaczne z użyciem eval()- podlega wstrzyknięciu skryptu! Używać tylko z najwyższą ostrożnością!
amfetamachine
1

Nie możesz ustawić źródła FIX iframe lub uniemożliwić przesyłanie javascript / form do zmiany jego lokalizacji. Jednak można umieścić skrypt onload z działaniem strony i zmiana każdego łącza dynamicznego.

Jan Pfeifer
źródło
1 
$(".excel").click(function () {
    var t = $(this).closest(".tblGrid").attr("id");
    window.frames["Iframe" + t].document.location.href = pagename + "?tbl=" + t;
});

to jest to, czego używam, nie potrzeba do tego jQuery. w tym konkretnym scenariuszu dla każdej tabeli, którą mam z ikoną eksportu programu Excel, zmusza to ramkę iframe dołączoną do tej tabeli do załadowania tej samej strony ze zmienną w ciągu zapytania, którego strona szuka, a jeśli znaleziona odpowiedź zapisuje strumień z excel MIME i zawiera dane dla tej tabeli.

vernmic
źródło